Back to overview
Block Libraries
Reusable component libraries per industry for consistent websites.
What are Block Libraries?
A Block Library is a collection of reusable components (blocks) grouped by industry or style. Think of a library for dentists, restaurants, estate agents or salons.
Each library contains:
• A set of components (e.g. Hero, Menu, Opening Hours)
• Design tokens (colours, fonts, spacing)
• A version number (semver: 1.0.0)
Creating a library
Click "New library" and fill in:
1. Name – A recognisable name (e.g. "Restaurant Pro")
2. Widget – The industry the library is intended for (dentist, restaurant, real estate, salon, legal or generic)
After creating, you can select components and configure design tokens.
Components and design tokens
In the library editor you can:
• Select components that suit the industry
• Configure design tokens: primary colour, font, spacing, border-radius
• Preview how the components look with your tokens
Tokens are automatically applied to all components in the library.
Tips
- Choose tokens that match the industry's brand style. You can still override them per site.
- The more components you add, the more flexible the library is for different sites.
Version management and publishing
Each library has a version number (e.g. 1.0.0). When you publish changes, you choose the update type:
• Patch (1.0.1) – Small bug fixes or tweaks
• Minor (1.1.0) – New components or features
• Major (2.0.0) – Breaking changes
Sites using the library can update to the latest version.
Note
- A major update may affect existing sites. Always test on a draft site before rolling out a major version.
Linking token presets
Each library can be linked to a set of design token presets. These are predefined combinations of colours, fonts and spacing that suit a particular industry.
To link a token preset:
1. Open the library editor
2. Go to the "Design Tokens" tab
3. Choose an existing preset or create a new one
4. Save — the tokens are automatically applied to all components
Token presets ensure that all sites using this library have a consistent look.
Tips
- Create presets per industry: a dentist preset with calm blue tones, a restaurant preset with warm colours.
- You can still override the tokens per site if the client has their own brand identity.
Assigning a library to sites
You can assign a library to one or more sites. This gives those sites access to all components and tokens from the library.
To assign a library:
1. Go to the library settings
2. Click "Assign sites"
3. Select the sites that should use this library
4. Confirm — the components are immediately available in the page builder of those sites
A site can only use one library at a time. When switching libraries, existing blocks are not removed, but the available components change.
Tips
- Assign a library when creating a site via a blueprint for the fastest setup.
- After switching libraries, check that all existing blocks still render correctly.
Note
- Switching libraries on an existing site may cause some blocks to no longer be available in the editor.