Review UI with evidence
Separate deterministic defects from subjective design recommendations.
Workflow
-
Read
.21st/design.json, project instructions, and the relevant source. -
Run the deterministic review first:
-
Inspect the actual component composition and runtime states. Validate claims against code rather than inferring behavior from names.
-
Group findings into:
- deterministic defects;
- design-system drift;
- accessibility and interaction defects;
- responsive risks;
- subjective product/design recommendations.
-
Prioritize by user impact and include exact file and line attribution.
-
Use
21st review <path> --fixonly for deterministic, low-ambiguity fixes. Never silently redesign, change brand identity, or alter product behavior. -
Run relevant project tests after fixes and rerun review to prove resolution.
Review priorities
- semantic controls and accessible names;
- keyboard access, focus visibility, and dialog/menu behavior;
- image alternatives and meaningful labels;
- touch target size and disabled/loading states;
- responsive overflow and fixed-width assumptions;
- reduced-motion handling;
- hardcoded visual values that conflict with project tokens;
- duplicate primitives instead of existing components;
- inconsistent typography, radius, spacing, shadows, and icons;
- fake data, placeholder copy, or missing empty/error states.
Output
Lead with actionable findings ordered by severity. Keep subjective suggestions clearly labeled. If no issue is proven, say so and state what was inspected.
