What problem does it solve?
This design skill automates the creation of DESIGN.md files optimized for Google Stitch by translating frontend design taste into semantic, Stitch-friendly specifications for color, typography, layout, and motion.
Core Features & Use Cases
- Visual atmosphere mapping to mood, density, and motion intensity that Stitch can interpret for prompts.
- Color calibration with neutral bases and a single accent, including hex codes and usage rules.
- Typography architecture with font stacks, scale hierarchy, and anti-patterns.
- Component behaviors: buttons, cards, inputs, loaders, and empty/error states defined for Stitch output.
- Layout principles: grid-first structures, max-width containment, responsive rules, and non-overlapping layouts.
- Motion philosophy: spring-based dynamics, perpetual micro-interactions, and cascade reveals.
- Anti-patterns: explicit bans to prevent generic AI UI clichés and unsafe patterns.
Quick Start
Provide a project brief and I will generate a DESIGN.md tuned for Google Stitch that encodes atmosphere, color, typography, layout, and motion rules.