zaklad MCP Server

A platform for building design systems. This MCP server lets you create, manage and read your own design system with AI: build and edit design tokens, themes, components, and icons. Zaklad turns them into a Figma library and production-ready code.

View on zaklad.app

Documentation

Free Beta is now live — v0.9.41

A complete design system

in minutes, not months.

Point Zaklad at your brand and it builds your entire system end to end: tokens, Figma libraries, typed components, and documentation. A power tool for design-systems specialists, and a proper system in reach of solo designers, startups, and agencies who’ve never built one.

Get started See how it works

Start the wizard instantly. Free forever plan available.

Web + nativeOne library, ReactJS and React Native

1:1 Figma ↔ codeSame prop names, both sides

Inherit everywhereThemes, tokens, sizes all cascade

One tool, not manyTokens, Figma, components, docs, integrated

THE PROBLEM

Design systems are expensive.

They shouldn't be.

Buried in execution

Most DS hours go to execution: tokens, themes, sync scripts. Strategy gets what’s left.

Fragmented tools

One tool for tokens. Another for components. Custom scripts for Figma. Nothing talks to anything.

Reinvent the wheel

Every team builds its own architecture and conventions. The same effort, recreated every time.

Traditional approach

  • Dedicated specialist team to build and maintain
  • Plus a paid tool stack to cover the gaps
  • Design every component from scratch
  • Choose and maintain your own architecture
  • Maintain custom build pipelines
  • Connect Figma, code, and docs yourself
  • Keep everything in sync manually
  • Write and maintain documentation

Months to v1.0Plus an average €200–400k/year in team salaries

With Zaklad

  • Solo builders can ship; a force multiplier for specialists
  • One subscription replaces the tool stack
  • Wizard, import, or build from scratch
  • Best-practice architecture built in
  • Full build pipeline included
  • Figma sync via the Zaklad plugin
  • Themes, tokens, and sizes all cascade
  • Documentation stays current with the source

Minutes to v1.0Plans from solo to enterprise. See pricing

HOW IT WORKS

Three steps to a complete system.

01

Point it at your brand

Start with the wizard, import your existing system, or build from scratch. Colours and fonts go in by their real names, and come out as a full token architecture.

02

Dial it in

Refine tokens, themes, and scale tiers with live preview. Every inherited value updates automatically.

03

Ship it everywhere

One click sends Figma libraries to designers, typed packages to developers, and docs that stay current with both.

From here, it keeps up with you.

Your brand evolves, your team grows, your system stays aligned. No rebuilds. No handoffs. No drift.

WHY ZAKLAD

Everything your design system needs.

Nothing it doesn't.

Brand to system, in minutes

The wizard takes your brand and builds a complete token architecture in minutes: OKLCH palettes, type scales, spacing, components, and themes. Skip it to import an existing system or build from scratch.

Small brands1–3 colours, a full system in minutes

Mid-size teams5–8 brand colours, intelligent role mapping

Large teamsweeks of architecture work, compressed to minutes

brand.500 bg.primary button.bg

One change. Everything updates.

Change a foundation value and your semantic tokens, component tokens, themes, Figma Variables, and development packages all follow. The architecture does the work, so changes stay cheap however far the system grows.

  • Three-layer cascade: Foundation → Semantic → Component
  • Themes inherit from each other, changes cascade down
  • Auto-fill on semantic tokens, component sizes, and scale tiers
  • Token calculations like spacing.md = dimension.base × 4

brand.500changed

bg.primaryupdates

button.bgupdates

Themesinherit

Figma Variablesyncs

Developmentfollows

Tokens to production. One platform.

Other tools hand you tokens and wish you luck. Zaklad ships the whole chain: cross-platform components for web and native, Figma Variables with Code Connect, typed packages, and generated documentation. Designers and developers land on the same source.

  • Figma Variables, Text Styles, icon components, and Code Connect
  • Cross-platform components, one library for ReactJS and React Native
  • Fully typed packages with 1:1 prop parity to Figma
  • Documentation generated from the source of truth
  • Read/write MCP endpoint and a single-file DESIGN.md for any AI agent

Tokens

Components

Figma

Code

Docs

Switch without starting over

Already have a design system? Paste your DTCG JSON and Zaklad imports the whole structure, names intact, no per-token remapping. You upgrade your system, you don’t rebuild it.

DTCG JSON.zaklad

tokens.jsonDTCG

{
  "color": { "primary": { "$value": "#28c0c2" } },
  "spacing": { "md": { "$value": "1rem" } },
  "radius": { "sm": { "$value": "0.25rem" } }
}

Imported as

color.primary#28c0c2

spacing.md1rem

radius.sm0.25rem

Explore all features

Start your system.

We’ll handle the rest.

Free to start. Fully managed. No credit card required.

Start free View pricing