frontend-excellence-standards

name

frontend-excellence-standards

description

Principal-engineer standards reference for frontend UI, aesthetics, accessibility, and performance. Use when super-mode-core loads this for frontend-heavy work, or when a skill needs the canonical frontend discipline without owning the rules. Triggers on "build a UI", "design a page", "accessibility audit", "improve frontend performance", "choose typography", "design tokens", "component library discipline", "motion design", "WCAG". Thin dispatch skill — the actual rules live in the canonical frontend-pe/references/design-rules.md; this skill wraps them with a quality-gate checklist for super-mode orchestration. Not for: standalone user invocation (use frontend-pe, frontend-uiux-designer, or ultrathink-frontend depending on scope). This is an internal domain reference loaded by super-mode-core.

Frontend Excellence Standards

Audience: super-mode-core loading this as the frontend domain reference; or any skill that needs the frontend quality-gate checklist without owning the shared rules.

Goal: Provide a single quality-gate checklist that enforces the canonical frontend rules when a super-mode orchestration touches frontend work. Do NOT duplicate the rules themselves — delegate to the canonical source.

Shared discipline (load this first — it is the whole standard)

MANDATORY: Read ../frontend-pe/references/design-rules.md in full. It is the canonical source for:

• Banned defaults (Inter/Roboto/Arial/system-ui, purple-on-white, evenly-distributed palettes, flat backgrounds by default, template symmetry, scattered micro-interactions, aesthetic convergence)
• UI library discipline (Shadcn/Radix/MUI/Headless UI — style primitives, do not rebuild)
• Typography discipline (display + body pairing, modular scale, letter-spacing rules)
• Color discipline (dominant + accent, OKLCH neutral scale, WCAG AA minimum)
• Motion discipline (one hero moment, transform/opacity, spring physics, reduced-motion respect)