What problem does it solve? Designing consistent, accessible interfaces requires scattered knowledge about styles, color palettes, typography, UX rules, and framework-specific patterns. This Skill consolidates that knowledge into a searchable local database so design decisions are grounded in curated data instead of guesswork. ## Core Features & Use Cases - Design System Generation: Run a single --design-system query to get a complete recommendation covering layout pattern, style, semantic color tokens, font pairings, effects, and anti-patterns, with optional persistence to a Master + page-override file structure. - Domain-Specific Search: Query 12 domains (style, color, typography, chart, icons, UX guidelines, GSAP motion, landing patterns, and more) plus 22 technology stacks including React, Next.js, Vue, Flutter, SwiftUI, and Tailwind via a BM25 search engine. - Design Dials: Tune output with 1-10 variance, motion, and density sliders that bias style selection, attach GSAP snippets, and adjust spacing scales. - Use Case: When asked to build a SaaS dashboard in Next.js, generate a persisted design system, then run targeted UX and stack queries to implement accessible, performant components. ## Quick Start Ask the agent to generate a design system for your product type and then apply the recommended style, colors, and typography to your page.
