What problem does it solve? Generic AI-generated frontend code tends to look like every other SaaS template: default fonts, heavy shadows, gradients, and clichéd copy. This Skill enforces a strict design protocol so generated HTML, React, Tailwind, or Vue output follows a refined editorial, document-style aesthetic without manual redesign. ## 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. - Complete Design System: Defines typography hierarchies (sans, editorial serif, monospace), a warm monochrome palette with muted pastel accents, and precise component specs for bento grids, buttons, badges, accordions, and keystroke UIs. - Motion & Imagery Directives: Specifies subtle scroll-entry animations via IntersectionObserver, staggered reveals, ambient gradient layers, and rules for icons, illustrations, and photography. - Use Case: Ask for a landing page or dashboard and receive code with crisp 1px borders, generous whitespace, tight serif headlines, and quiet micro-animations 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 editorial typography.
