What problem does it solve? Generic AI-generated frontend code tends to look like every other SaaS landing page: default fonts, heavy shadows, gradients, and clichéd copy. This Skill enforces a strict design protocol so generated HTML, React, Tailwind, or Vue code follows a refined editorial, document-style aesthetic without manual design corrections. ## Core Features & Use Cases - Design Constraint Enforcement: Bans generic defaults like Inter/Roboto fonts, Lucide icons, heavy drop shadows, gradients, pill-shaped containers, and AI copywriting clichés. - Complete Design System: Defines typography hierarchies (serif hero headings, monospace metadata), a warm monochrome palette with muted pastel accents, and precise component specs for bento grids, buttons, tags, accordions, and keystroke UIs. - Motion Guidelines: Specifies subtle scroll-entry animations, staggered reveals, and hover micro-interactions using transform and opacity only. - Use Case: Ask for a landing page or dashboard, and receive production-ready code with 1px #EAEAEA borders, generous macro-whitespace, and editorial typography instead of a generic template look. ## Quick Start Use the minimalist-ui skill to build a landing page for a note-taking app with a bento feature grid and serif hero heading.
