design-review: a senior design critique in your terminal
" />
What it does
Reviews like a design lead would.
🎯Fix what matters first<br>Every finding ranked blocking → important → polish, so you ship the critical stuff and skip the bikeshedding.
📐Receipts, not opinions<br>Real numbers behind every call: WCAG contrast, 45–75ch line length, 44px tap targets. Never "make it pop."
🖼️Reviews anything you've got<br>A live URL, a screenshot, or a raw component. It reads the code and cites the exact line.
⚡It flags. It fixes.<br>Run --apply and watch it rewrite contrast, focus states, alt text and motion, in place.
♿Accessibility, every pass<br>Contrast, semantics, focus order, labels, and reduced-motion. Caught automatically, not bolted on later.
✨Tells you what's working<br>Closes every review with your strengths and the one change that moves the needle most.
What it reviews
Ten dimensions, every pass.
01Hierarchy & layout<br>Clear focal point, sensible scan path, grouping, alignment to a grid, whitespace as structure.
02Typography<br>Limited type scale, line-height, 45–75ch measure, font pairing, no widows or orphans.
03Spacing & rhythm<br>Consistent 4/8px scale, even vertical rhythm, symmetric padding. No arbitrary gaps.
04Color & contrast<br>WCAG AA (4.5:1 text, 3:1 large/UI), restrained palette, never color alone for meaning.
05Motion<br>Purposeful, fast timings, natural easing, and a prefers-reduced-motion variant.
06Component states<br>Hover, focus-visible, active, disabled, loading, empty, error, plus ≥44px tap targets.
07Accessibility<br>Semantic HTML, labels, alt text, logical focus order, full keyboard operability.
08Responsiveness<br>Fluid type and spacing, no overflow or clipping from 320px up, touch-appropriate.
09Content & copy<br>Clear headlines, scannable structure, descriptive CTAs, human microcopy and errors.
10Consistency & brand<br>Reused design tokens, consistent radii, shadows, and icon style across screens.
See it work
Watch a real critique and apply the fixes.
Install
Up and running in 30 seconds.
Add the marketplace and install the plugin:
# in Claude Code<br>/plugin marketplace add Superfuture/design-review<br>/plugin install design-review@superfuture
# …or drop the folder in manually<br>git clone https://github.com/Superfuture/design-review /tmp/dr<br>cp -r /tmp/dr/design-review/skills/design-review ~/.claude/skills/
Then just ask: "design review officialjp.com" or "critique this paywall screenshot."
Pricing
Free to try. Pay if it earns its place.
Free
$0
forever
The full skill + rubric<br>URL, image & code review<br>Community updates
Install free
Recommended<br>Pro
$12
one-time
Everything in Free<br>Expanded mobile & SwiftUI rubric<br>Brand-token consistency checks<br>Priority updates
Get Pro →
Team
$49
per team
Everything in Pro<br>Shareable team config<br>Custom rubric tuning<br>Email support
Get Team
FAQ
Questions, answered.
What is design-review?A Claude Code skill that runs a senior-level design critique of any URL, screenshot, or component, ranked from blocking to polish, each finding with a specific fix you can auto-apply.
What's the difference between Free and Pro?Free is the full skill and rubric, run locally in your terminal. Pro adds depth the free tier doesn't cover: an expanded mobile & SwiftUI rubric and brand-token consistency checks, generated server-side so it stays current.
How do I activate Pro?After checkout you get a license key on the activation page. In Claude Code run /design-review:activate , or paste the key when Crit first asks on a Pro review. Your Pro reviews then include the extra depth.
Is it a subscription?No. Pro is a one-time $12 unlock. Team is a separate plan, currently by waitlist.
I lost my key.It's tied to your email. Get in touch and we'll resend it.
Refunds?If Pro isn't earning its place, contact us within 14 days for a refund.
Join the Pro waitlist
It's not live yet, drop your email and you'll be first to know when Pro ships.
Notify me<br>You're on the list. Thanks! 🎉
Something went wrong. Please try again.