SuperDesign

**Judgement:** High-quality, opinionated frontend design skill that gives the model a strong process and modern defaults for building attractive, usable UIs. It is especially strong for landing pages, dashboards, and component-level design, including layout, theming, and micro-interactions. **Key strengths:** - Enforces a structured workflow: ASCII wireframes → theme tokens → animation plan → code. - Encodes up-to-date design patterns (Vercel/Linear-style dark, neo-brutalism, glassmorphism) and modern color/typography practices. - Emphasizes accessibility (semantics, contrast, keyboard navigation) and responsive, mobile-first design. - Provides concrete implementation patterns with Tailwind, Flowbite, and Lucide, plus guidance on placeholder images. **Risks / limitations:** - Opinionated aesthetics (e.g., avoiding certain colors, favoring specific fonts and patterns) may conflict with strict brand guidelines; the agent should adapt tokens to the product’s design system when one exists. - Heavy reliance on `oklch()` colors may require fallbacks for legacy browser support. - It focuses on visual and interaction design quality, not on backend logic or complex state management. **Recommended scenarios:** - Use by default whenever the task involves **UI/UX creation**: landing pages, marketing sites, dashboards, or reusable components. - When generating **design systems or theme tokens** for new products, especially with dark/light modes. - When planning **animations and micro-interactions** for buttons, page transitions, and component entry effects. - As a companion to Tailwind/Flowbite-based prototypes to ensure the output feels modern, consistent, and accessible.