Design & Frontend Tools
Skills, components, and design systems that make AI build premium interfaces. 400+ design skills indexed.
Design System Files (7 tools)
Ranked by coverage and community adoption.
getdesign.md
70 DESIGN.md files sourced from top brands including Apple, Stripe, and Vercel. The original design system directory.
designdotmd.directory
156 themed DESIGN.md files organized by style, industry, and complexity. The largest curated collection.
VoltAgent awesome-claude-design
68 community-contributed design systems with Claude Code integration guides and real-world examples.
Sticklight
22 frontend skills covering layout, animation, typography, and responsive patterns for AI agents.
21st.dev
Community-built React components designed for AI consumption. Copy-paste ready with Tailwind styling.
shadcn/ui
The component library for React. Accessible, composable, and endlessly customizable with Radix primitives.
Open CoDesign
Open-source alternative to Claude Design, v0, Lovable, Bolt. Turn prompts into polished artifacts locally with any model. Desktop app, BYOK, design-to-code.
Design Skills (8 skills)
Installed skills that shape how AI writes frontend code.
ui-ux-pro-max
Full-stack UI/UX engineering with metric-based rules and strict anti-generic patterns.
frontend-design
Frontend layout, spacing, and component architecture for production interfaces.
soft-skill
High-end agency design with exact fonts, spacing, shadows, card structures, and animations.
taste-skill
Senior UI/UX engineer persona enforcing metric-based rules and overriding default LLM biases.
impeccable-design
Warm-paper editorial sanctuary with committed serif display, decisive magenta, and flat surfaces.
brutalist-skill
Raw mechanical interfaces fusing Swiss typographic print with military terminal aesthetics.
minimalist-skill
Clean editorial-style interfaces with warm monochrome, typographic contrast, and muted pastels.
anti-ai-design-slop
Detects and eliminates generic AI design patterns. Gradient blobs, stock heroes, and bland cards.
Component Libraries (9 libraries)
MagicUI→
Animated React components built for landing pages. Smooth transitions, scroll effects, and interactive elements.
Lucide React→
Beautiful and consistent icon library with 1,500+ icons. Tree-shakeable, TypeScript-native.
Radix UI→
Unstyled, accessible component primitives. The foundation under shadcn/ui and most modern React design systems.
Framer Motion→
Production-ready animation library for React. Declarative gestures, layout animations, and spring physics.
Mobbin→
The world's largest library of mobile and web design patterns. 300K+ screenshots from real apps. Search by screen type, UI element, or flow. Freemium.
60fps.design→
Curated collection of delightful UI/UX animation and interaction design details from best-in-class apps. Endless inspiration for micro-interactions and motion.
Spotted in Prod→
Discover great apps and real product design decisions. Curated showcase of production apps with UX breakdowns and design patterns.
Open Design (19K stars)→
Open-source Claude Design alternative. 31 composable skills, 72 brand-grade design systems, 13 coding-agent CLIs supported. Local-first, BYOK, web-deployable.
Canvas Design (Anthropic Official)→
Create social media graphics, posters, covers, and visual assets from text descriptions. Export PNG/PDF. Official Anthropic skill.
Web Artifacts Builder (Anthropic Official)→
Create interactive calculators, dashboards, data visualizations and mini web apps from natural language. Official Anthropic skill.
Premium Patterns
Get all 400+ design skills with AI Brain Pro
Includes every design system file, component skill, and premium pattern plus 1,700+ additional skills, agents, memory, and hooks.
Get AI Brain Pro