Appearance
Saved components & the store
Once you've built something you like — a styled card, a call-to-action, a whole section — you can save it and reuse it instead of rebuilding it. This page covers two libraries: your own saved components, and the curated component store you can install from.
Both live in the Library tab of the right-hand pane.
Saving your own components
Select any node on the canvas — a single button, or a whole section subtree with all its children — and save it. FlowRunner offers two scopes:
- This page — saved into the document's own component list. It appears under This page in the Library tab, ready to drop back onto the current page.
- Workspace — the Save to workspace button stores the selected component in your workspace library, where it's reusable across every project in that workspace.
When you drop a saved component back onto the canvas, it's cloned with fresh ids — so the copy is fully independent and editing it never touches the original.
TIP
Save the version you're proud of. A pricing card you've retexted and recoloured, saved to the workspace library, becomes a one-drop building block on your next project.
The component store
The Browse component store button opens a small catalog of first-party, ready-made components. Press Install on any of them and it's added to your workspace library — after that it behaves exactly like a component you saved yourself.
The current curated catalog:
| Component | Category | What it is |
|---|---|---|
| Primary CTA button | Buttons | A bold call-to-action button |
| Feature card | Cards | A title and description for one feature |
| Testimonial | Content | A customer quote with attribution |
| Pricing card | Cards | A plan name, price, and button |
Installing is one click; a component you've already installed shows as Installed so you don't add it twice.
INFO
📸 Screenshot — the Component store dialog listing the curated components with Install buttons.
Store vs. blocks
It's worth knowing the difference between the two reusable surfaces:
| Component store | Blocks | |
|---|---|---|
| Grain | Small, single pieces (a button, a card) | Whole sections (hero, footer, pricing) |
| Where | Library tab → Browse component store | Blocks tab |
| After you pick it | Installed into your workspace library | Dropped straight onto the page |
Use blocks to lay out a page fast; use the store and your saved components to reuse the smaller pieces you'll place again and again.
NOTE
The store is the foundation for a wider ecosystem — curated first-party components today, with third-party publishing and node add-ons planned on top of the same mechanism.