What problem does it solve? AI-generated UI often falls back to generic, templated styling with arbitrary colors and inconsistent spacing. This Skill replaces those defaults with a concrete, opinionated design contract drawn from 150 brand-grade design systems, so every page, dashboard, or component follows a coherent palette, type scale, and component spec. ## Core Features & Use Cases - 150 Curated Design Systems: Each system in systems/<name>/ ships a DESIGN.md contract (palette, typography, components, layout, depth, do's/don'ts, responsive rules, agent prompt guide) plus exact design-tokens.json values. - Brand and Mood Matching: Systems are indexed by category β AI/LLM, developer tools, fintech, automotive, editorial, morphism effects, and more β so you can match a brief's mood, brand, or domain (e.g., stripe for fintech, bugatti for cinematic luxury, default for safe neutral). - Use Case: When asked to build a landing page for a coffee brand, pick the starbucks system, read its DESIGN.md, and apply its four-tier green palette, 50px pill buttons, and SoDoSans-style typography instead of inventing ad-hoc styles. ## Quick Start Use the design-systems skill to restyle this dashboard with the linear-app design system, following its DESIGN.md palette and design-tokens.json values.
