Design once. Reuse everywhere.
¶ Why use Symbols?
Symbols are perfect for parts of your site that repeat — and that you want to keep consistent.
Common examples:
- Navigation bars
- Footers
- Call-to-action sections
- Cards or previews
They help you avoid copy-paste errors and keep your design clean and maintainable.
¶ How it works
¶ 1. Create a Symbol
Select one or more elements on your page, then right-click → Create Symbol.
You’ll be prompted to name it. That name appears in the Symbols panel and in the layer tree.
¶ 2. Reuse it
From the Symbols panel, drag your symbol anywhere — even on other pages.
All instances stay in sync: any change made to one updates all others.
¶ 3. Customize it (coming soon)
In future updates, you’ll be able to:
- Edit text/images per instance
- Show/hide elements inside a symbol
- Connect symbols to dynamic CMS data
¶ Managing Symbols
You can:
- Rename a symbol
- Unlink an instance to make it independent
- Pause sync on specific parts (planned)
- Find all instances from the Symbols panel (planned)
We're also working on:
- A visual indicator to highlight which blocks are Symbols
- A shortcut to scroll to all instances across pages
¶ Known limitations
- Symbols can’t be nested inside other symbols
- Style sync might not work in every edge case
If something’s missing, post your ideas on the roadmap or community forum.