frontend-designlisted

# Frontend Design Build distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. The method: pick a bold aesthetic direction, apply a color formula, pair typography deliberately, specify interaction states, and execute with precision. Bold maximalism and refined minimalism both work — the key is intentionality, not intensity. ## When to use - Building web components, pages, or applications (HTML/CSS/JS, React, Vue, Svelte, etc.) - Choosing a design direction, color palette, or typography system for a project - Reviewing UI for visual quality, accessibility, or interaction polish - Implementing responsive layouts, dark mode, or platform-specific conventions (Apple HIG, Material) - Triggers on "frontend", "UI design", "组件设计", "界面设计", "前端设计", "视觉风格" **Not for:** pure data visualization (use dataviz); backend logic with no visual surface; API contract design (use api-design). Visually important web work where image-first is preferred (use `image-to-code`). ## Steps ### 1. Define the element and project context Before coding, commit to a bold aesthetic direction. Answer: - **Element**: What are you building? (button, card, modal, navbar, page, full app) - **Purpose**: What problem does this interface solve? Who uses it? - **Tone**: Pick an extreme — brutally minimal, maximalist, retro-futuristic, organic, luxury, playful, editorial, brutalist, art deco, industrial. Commit fully; never default to "safe." - **Differentiation**: What makes th