UI Design Brain

This skill provides a curated knowledge base of 60+ UI component patterns sourced from component.gallery and enriched with best practices, layout guidance, and usage rules. It replaces generic guessing with real design-system knowledge when generating interfaces.

Before writing any UI code, consult this skill to select the right components and follow their best practices. Read components.md for the full reference.

When to Use This Skill

Apply whenever the user asks to build, design, or generate:

• Web pages, landing pages, marketing sites
• SaaS dashboards, admin panels, settings pages
• Forms, data tables, navigation structures
• Modals, drawers, popovers, or overlay patterns
• Any React, HTML/CSS, or Tailwind UI component

Design Philosophy

Every generated interface should feel modern, minimal, and production-ready — not like a template.