Build and manage design systems with AI across tokens, themes, components, and code.
Copy the install command and let the AI configure it · recommended for beginners
Please install the "app.zaklad/design-system" MCP server from askskill: Run: claude mcp add --transport http 'app-zaklad-design-system' 'https://platform.zaklad.app/api/mcp'
Create a design token set for a B2B SaaS product, including primary and secondary colors, typography scale, spacing, radii, and shadows. Output structured tokens for both light and dark themes.
A structured token set covering color, typography, spacing, and other core variables for light and dark themes.
For an e-commerce admin dashboard, design a component library spec covering buttons, inputs, tables, modals, and navigation components, including states, sizes, variants, usage rules, and how they map to Figma and frontend code.
A component library structure and specification with variants, interaction states, and clear design-to-code mapping.
Organize an icon and theme asset standard for an enterprise product, unifying icon style, sizes, stroke widths, naming conventions, and providing recommendations for multi-brand theme extension.
A unified standard for icons and theme assets, plus implementation guidance for multi-brand scaling.
No documentation provided
Check the source repo for usage and examples.
Create or update a professional Figma design system from a codebase.
Extract design tokens from public websites into JSON and CSS variables.
Extract a website’s design system tokens for reuse and analysis.
Generate design system tokens for color, type, spacing, shape, and icons.
Turn code or page descriptions into full Figma screens using design systems.
Analyze design needs, extract visual tokens, generate concepts, and audit visuals.