baseline-ui

Enforces design and interaction constraints to prevent common UI anti-patterns in Tailwind CSS projects.

- Validates animation durations (max 200ms for interactions), restricts animations to compositor properties only, and enforces prefers-reduced-motion respect

- Requires accessible component primitives (Base UI, React Aria, Radix) for interactive elements and enforces keyboard behavior standards

- Checks typography rules including text-balance for headings, tabular-nums for data, and prevents arbitrary letter-spacing modifications

- Prevents layout anti-patterns like h-screen (use h-dvh instead), arbitrary z-index values, and animating layout properties

- Reviews files against all constraints and outputs exact violations with code-level fixes

Baseline UI

Enforces an opinionated UI baseline to prevent AI-generated interface slop.

How to use

-

/baseline-ui
Apply these constraints to any UI work in this conversation.

-

/baseline-ui <file>
Review the file against all constraints below and output:

- violations (quote the exact line/snippet)

- why it matters (1 short sentence)

- a concrete fix (code-level suggestion)

Stack