What problem does it solve? Generic AI-generated frontend code tends to produce cookie-cutter SaaS designs with 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 aesthetic with warm monochrome colors, typographic contrast, and flat bento-grid layouts. ## Core Features & Use Cases - Design Constraint Enforcement: Bans generic defaults like Inter/Roboto fonts, Lucide icons, heavy drop shadows, gradients, pill-shaped containers, emojis, and AI copywriting clichés. - Component Specifications: Provides exact styling rules for bento grids, CTA buttons, tags, accordions, keystroke UIs, and faux-OS window chrome with precise hex values and border-radius limits. - Motion & Imagery Directives: Defines subtle scroll-entry animations, staggered reveals, ambient background motion, and guidance for icons, illustrations, and photography. - Use Case: Ask an agent to build a landing page or dashboard, and receive code with editorial serif headings, off-black body text, 1px light-gray borders, muted pastel accents, and generous whitespace 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 hero section, bento feature grid, and FAQ accordion.
