Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →sickn33/ui-review
Review UI code for design system compliance, accessibility, and best practices
Passed 17 of 20 test cases with the skill, and 10 of 20 without it.
and 9 more in the full report
8 fixed12 passed either way3 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 7 test cases the skill fixed. Same model, same prompt, with and without the skill.
Check `src/components/LoginForm.tsx` where input fields are set to `h-8` (32px) and submit buttons are `h-10` (40px) without `focus-visible` styling.
| Checked | Without skill | With skill |
|---|---|---|
| Flags height mismatch between control elements in the same form. | Missed | Passed |
| Flags interactive elements under 44px height. | Missed | Passed |
| Flags missing focus-visible outline styles. | Missed | Passed |
The instructions your model reads when the skill loads.
Use this skill when you need review UI code for design system compliance, accessibility, and best practices.
/ss-a11y/ss-audit/ss-lintReview the file: $ARGUMENTS
text-foreground, bg-brand, etc.)p-6 not p-[24px])shadow-[var(--shadow-card)])rounded-md, rounded-lg, rounded-2xl)data-slot attributecn() for className mergingReact.ComponentProps<>className prop overridefocus-visible styles on all interactive elementsaria-* attributes where neededprefers-reduced-motionalt texttest cases passed, vs 10 / 20 without
Published skills whose descriptions closely match this one, with their headline benchmark lift.
More skills from the same source and nearby in the registry, with their headline benchmark lift.