ICMS.

A design system for recurring client projects. Figma variables, components and a demo theme create a shared foundation for design and the page builder.

Commission: Agency partner
Field: CMS · Page Builders · Design Systems
Contribution: Design System Concept · Design Tokens · Component Library · Theme & Assets · TokenLab Integration
Year: 2025/26

Industrial robots and devices as the hero visual for the ICMS demo theme

Color Primary
Text Muted
Text Primary
Viewport
H1

For an agency partner, we developed a design system that gives new client projects a shared starting point. A demo theme designed entirely in Figma connects variables and reusable components with the requirements of the existing page builder.

Scope

Project timeline

Week 1Week 12

ICMS demo theme with a dark homepage on a laptop

Design for new client projects should not have to start from scratch every time. The agency needed a Figma boilerplate with recurring foundations already in place, designed to work with its own page builder. The challenge was to align design with the technical structure.

The demo theme presents this foundation as a modern, minimalist website. The Genesys theme makes the design tangible, from the colour palette and product imagery to content modules. Tokens, assets and components together form the Figma design system.

Primary colour scale of the ICMS demo theme, from light to dark blue tones

Download module with a brochure visual and document links in the demo theme

Figma variables define the shared design values. Token names follow Tailwind conventions and are structured for export. A component library builds on this foundation, consistently representing basic elements and composed building blocks.

Light and dark modes are already implemented in the demo theme. The variable structure can be extended with further modes, such as Wide and Narrow layouts or a high-contrast presentation. These variants can build on the same foundation without requiring a separate design system.

The existing ICMS component set provided the basis for the library. The agency partner's framework uses Figma variables and component details to transfer design into code in a standardised way. Our contribution was the Figma side of this connection: a theme and system structured to fit the page builder.

TokenLab support and integration extend this foundation to token exports. TokenLab allows export pipelines, transformations and target formats to be tailored to development requirements. Tokens can be delivered in the form required by the framework and the wider workflow.

Figma library showing spacing, atomic and composed components, and text styles

Content modules of the ICMS demo theme in tablet views

The demo theme turns the building blocks into concrete page sections. Product cards, navigation, industry content and team profiles show how the system can support different kinds of content. Recurring design patterns connect the views while leaving room for client-specific variations.