---
name: design
description: "UI and frontend design: aesthetic direction and typography for new UI, upgrading existing UI, accessibility (WCAG, screen readers, contrast), UI/UX principles, and critiquing a rendered page. Use when the user asks for UI or frontend design, accessibility fixes, or a visual review; load the file that matches the task."
---

# UI Design

| File | Load when |
|------|-----------|
| `references/frontend.md` | Building new UI or reshaping an existing one: aesthetic direction, typography, verifying with renders |
| `references/redesign.md` | Upgrading an existing website or app: audit the current design, find generic patterns, apply the standard without breaking functionality |
| `references/principles.md` | Any UI/UX decision: hierarchy, consistency, feedback, affordance, progressive disclosure, accessibility baseline |
| `references/critique.md` | Judging a rendered frontend: fourteen passes on screenshots, weighted score, hard caps |
| `references/brand.md` | Creating brand identity: brand-guidelines boards, logo systems, identity decks |

Build (`references/frontend.md`) decides the direction, `references/redesign.md` audits an existing one, and
`references/critique.md` scores the result. `references/principles.md` applies to all three.