frontend-design

Overview

A comprehensive frontend design skill from Impeccable that guides AI towards creating distinctive, production-grade interfaces that avoid generic AI aesthetics. Based on Anthropic's frontend-design skill with expanded coverage across 7 domain-specific reference files including typography, color systems, spatial design, dark mode, animation, and explicit anti-patterns.

Key Features

• Bold aesthetic direction — Guides AI to commit to intentional design choices rather than safe defaults: brutally minimal, retro-futuristic, organic, editorial, art deco, and more
• 7 reference domains — Typography (type scales, font pairing, OpenType), color and contrast (OKLCH, tinted neutrals, accessibility), spatial design, component architecture, dark mode, animation, and iconography
• Anti-pattern library — Explicitly tells the AI what NOT to do to avoid generic LLM template biases like Inter font, purple gradients, and cards nested in cards
• Modular type scales — Fluid sizing with clamp(), variable font weights, proper font loading strategies
• Production-grade output — Generates functional, accessible, visually striking code with cohesive aesthetic point-of-view

Who is this for?

Frontend developers and designers who want AI-generated UI to look distinctive and polished rather than generic. Ideal for anyone building web components, pages, applications, or artifacts who cares about design quality and wants to break free from the default LLM look.