Blocksify design tokens let blocks reuse global colors, gradients, shadows, spacing, and font sizes instead of hard-coding values.
Use tokens when a value should stay consistent across a site and still remain editable from one place.
What are Blocksify design tokens?
A design token is a named design value, such as a brand color or spacing step. Instead of typing the same value into every block, choose the token and let linked blocks follow it.
The token panels live in Global Settings. They cover color palettes, gradient presets, shadow presets, spacing presets, and font size presets.
How do tokens work?
Blocksify makes token values available to supported block controls across the site. Color, gradient, shadow, spacing, and font-size tokens appear in their matching pickers and sliders.
| Value type | How you choose it | What changes later |
| Global token | Choose a named option such as md, brand-mint, or bsy-soft. | The token value can change centrally. |
| Literal value | Type a one-off value such as 18px or #111827. | Only the block using that literal changes. |
Editing a token updates your whole site without rebuilding pages.
Try a token on a block
- Select a Section, Container, or Text block.
- Open the panel for the value you want to reuse, such as Colors, Spacing, or Typography.
- Choose a named global option instead of typing a custom value.
- Change that token in Global Settings. Blocks linked to the token follow the new value where that token is supported.
Why use tokens?
Sitewide edits stay centralized
When several blocks use the same token, editing that token can update every linked block. This is the main advantage over editing each Section, Container, or Text block one by one.
Theme palettes remain the source of brand colors
Blocksify does not add its own default brand palette. Theme-owned colors still come from the active theme, while Blocksify custom colors and gradients are for extra values the theme does not cover.
Editing a token updates your whole site
Use tokens for values that should change in one place, such as a brand accent, a card shadow, a spacing rhythm, or a type-size stop.
Note: Deleting a custom color, gradient, or shadow token is different from editing its value. Preview affected pages after deletion because linked blocks may need a fallback value.
Next step
Start with the Global Settings overview, then review the token family you use most often. Layout-heavy pages usually start with spacing presets, while brand-heavy pages usually start with color palettes.