verify-design
Installation
SKILL.md
Verify design
Code that compiles is not a finished design. Look at the result and fix it.
Loop
- Render. Open each changed screen in the running app with the available browser or screenshot tool. Capture a desktop and a mobile width.
- Look. Study the screenshot the way a designer would:
- Alignment: edges and baselines line up; nothing is a few pixels off.
- Spacing: gaps are consistent and come from the existing scale.
- Hierarchy: the most important thing reads first; one clear primary action.
- Fit: no clipped, overflowing, or awkwardly wrapped text; no horizontal scroll on mobile.
- Consistency: new elements match their neighbors in size, radius, color, and type.
- States the change touches: hover, focus, empty, loading, error, disabled.
- Fix. Correct what you saw using the project's existing tokens and components. Stay inside the current change.
- Repeat until a fresh screenshot shows nothing left to fix. After three passes, stop and list what remains.