Create Design System
create_design_systemGenerate a complete design-system starter from a brand color and product vibe, with accessibility-verified colors, fonts, icons, tokens, and component guidance for any platform.
Instructions
THE one-call foundation. Turn a brand color + product vibe + platform into a complete, coherent design-system starter: a direction card (named defaults to leave, the type pairing as a decision, one signature move, and a stock-region fact if the seed sits in indigo/violet/purple), accessibility-verified color (light+dark), a matched font pairing, an icon library, a modular type scale, an elevation ramp, ready-to-paste design tokens (CSS/Tailwind or SwiftUI/Compose), the components to build, and a build checklist — all generated to work together. Use this FIRST when someone says 'design/build me a website/app' to lay the foundation, then get_component_recipe for each component and get_design_roadmap for the full process.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| name | No | Brand/token name (default 'Brand') | |
| vibe | Yes | Product vibe / use case, e.g. 'modern SaaS dashboard', 'premium fintech app', 'bold marketing site', 'minimal portfolio' | |
| platform | No | Target platform (default web) — picks icon set and token output | |
| brand_color | Yes | Brand / primary color as hex, e.g. '#4F46E5' |