One foundation.
Many brands.
For Active24, we built a new website on a platform that separates shared functionality from each brand’s visual identity.
Each brand can have its own design, while the technical foundation, CMS and integrations stay shared. Active24.cz was the first website launched on this foundation.
470+
design tokens
55
editorial blocks
2
countries from one codebase
2022
partnership began
It started with a single design
The design was originally created in Figma for a new website for one of the hosting group’s brands. The project was then put on hold for a while.
But the design was built on variables and components so well that it didn’t have to serve just one website. We decided to turn it into a generic design system for the group’s entire brand portfolio.
Active24.cz became the first website where we proved the concept in live operation.
Not another standalone website, but a foundation for the whole group.
Unique design, no copied code
Each brand was meant to look like itself, but it didn’t need its own technical foundation to do so.
So we built the design system on variables that work the same way in Figma and in code. Colours, typography, buttons and other components can change by brand without rewriting the whole theme.
Stays shared
Technical foundation and generic theme
CMS and blocks
Integrations with central systems
Further development of the platform
Changes by brand
Colours and typography
Buttons and components
Content and language
Market configuration
New brand = configuration, not a rebuild.
One technical base for several brands
We built the platform as a WordPress multisite, so a single installation serves multiple brands and countries.
Figma
variables for colours, typography and components
WordPress multisite
generic theme and shared functionality
Central systems
products, hosting and domain prices, basket
Brand websites
localised content and each brand’s own look
Shared code means less duplication and simpler further development. Each brand still has room for its own visuals and content.
Active24.cz and Active24.eu now run on the same technical foundation, yet each can have localised content and its own brand configuration.
A design system that works as it does in Figma
The platform’s visuals are built from 470+ design tokens. Colours, typography and components are defined by shared variables.
A single change no longer has to be made separately in the front end, the editor and the admin.
For a new brand, the design parameters change. The functional foundation stays the same.
A rebrand does not have to mean a new front end.
Editors got their own building blocks
We built the website on the native Gutenberg editor and added 55 custom blocks.
The blocks have responsive settings right in the editor, so the editorial team can change both the content and how it is presented without a developer.
What editors build pages from
Hero sections
Product cards
Comparison tables
FAQ
Campaign blocks
Scroll animations
Products and prices are not updated by hand
The website is connected to the company’s central systems. Products, hosting and server prices, domain prices and other data sync directly via API.
Editors don’t have to retype data that is created and changed in other systems. The website shows current information straight from the source.
Editors manage content. Systems supply current data.
Domain pricing nobody updates by hand
Active24 offers registrations, renewals and transfers for hundreds of domain extensions.
Prices load directly from the central registry. Editors handle the copy and page content; the prices themselves update automatically.
The result is a price list nobody has to check and rewrite on a regular basis.
Prices straight from the source.
Configurators with instant price updates
Visitors configure hosting plans and virtual and dedicated servers to suit their needs.
They choose parameters such as the operating system, add-ons or billing period. The price is recalculated directly via API without reloading the page.
The visitor then sends the finished configuration straight to the basket.
Every parameter change recalculates the price without reloading the page.
Users do not see how many systems sit behind it
The platform works with central systems, APIs, configurators and multiple brands. What the user sees is a simple website that responds instantly.
The technical complexity stays inside the platform. Users get current prices, product configuration and information without unnecessary steps.
Complexity belongs in the architecture, not in the user interface.
One website became a long-term partnership
We delivered the implementation based on the Figma design, working closely with Active24’s in-house team.
We keep working on the platform after launch. New campaign blocks, product pages and other changes are added as the client needs them.
Design in Figma
The design was created in Figma. We delivered the technical foundation and the implementation.
Agile development
We worked in iterations so priorities could be adjusted during the project.
Working with the in-house team
We worked on the implementation directly with Active24’s in-house team.
Ongoing development and support
The partnership has been running since 2022, and the platform keeps evolving.
The result is more than a new website
Active24.cz was the first website built on the new shared foundation.
Live operation proved that a single technical foundation can combine a brand’s own design, shared functionality and data from central systems.
The platform is now the foundation for the client’s other websites. So a new brand doesn’t have to mean a new development project: the foundation stays shared, and only the design and content configuration change.
Active24 now runs on a platform that further websites can grow from.
Technology and architecture
Active24 needed a foundation that could carry multiple brands without duplicating code.
Design system
Figma design system
The design is built on variables and components rather than static screens. That is why it could serve multiple brands.
Design tokens
More than 470 tokens for colours, typography, spacing and components. They are defined once and apply to the front end, the editor and the admin.
Generic theme + brand configuration
The theme carries the functionality; the configuration carries the look. So a new brand doesn’t need its own copy of the theme.
CMS
WordPress Multisite
One installation serves multiple brands and countries with shared code, design and media library. Localisation is part of this foundation and does not need a separate project branch.
Gutenberg
Instead of a custom page builder, we used the native editor. Editors work in an environment that is part of WordPress and survives its updates.
Custom blocks for editors
55 blocks designed for this website, with responsive settings right in the editor. The design is not dictated by generic plugins.
Data and integrations
Integrations with central APIs
Products, hosting and server prices, and domain prices come from the systems where they originate. The website does not keep them in its own database.
Hosting and server configurators
Parameters are recalculated via API without reloading the page, so the price responds to every change instantly.
Basket integration
The finished configuration goes straight into checkout, and the user doesn’t have to enter it a second time.
A website for another brand need not be a new project.
We’ll design a technical foundation that grows with your product, your team and your brand portfolio.
No-obligation consultation.
We reply within 24 hours.