Check a screen in the browser at real sizes, like a designer would. Use when the user says \"review this screen\", \"check the layout\" or \"does this look right\".
Installs into .claude/skills of the current project.
Are you the author of Review A Screen?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/tonygorb-review-a-screen)
---
name: review-a-screen
description: "Check a screen in the browser at real sizes, like a designer would. Use when the user says \"review this screen\", \"check the layout\" or \"does this look right\"."
license: MIT
metadata:
author: Tony Gorb
source: https://github.com/tonygorb/skills
category: design
cover: "2 sizes"
---
# Review a screen
Look at the real thing, at real sizes, before anyone says it's done.
## Steps
1. Open only the screens that changed.
2. Look at each one on a laptop (1440 wide) and a phone (390 wide).
3. Take a screenshot of each size, and look at it properly.
4. Check spacing, alignment and text that wraps or gets cut off.
5. Tab through it: every button reachable, the focus always visible.
6. Check the empty, loading and error states, not only the happy one.
## Before it's done
- Look again after every fix.
- Show the screenshots, each size labelled.
## Never
- Never say it's done without screenshots.
- Never judge a screen from the code alone.
## What to hand back
For each screen: the sizes you looked at, what you found, what you fixed, and the screenshots.
