Install any skill in seconds. Free to start, no credit card required.
Get Started Free →elianiva/web-design-guidelines
Review UI code for Web Interface Guidelines compliance.
Passed 7 of 22 test cases with the skill, and 4 of 22 without it.
and 2 more in the full report
3 fixed4 passed either way16 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 3 test cases the skill fixed. Same model, same prompt, with and without the skill.
Audit `src/components/CleanCard.tsx` for compliance: ```tsx // src/components/CleanCard.tsx:1 export function CleanCard({ title }: { title: string }) { return ( <article className="p-4 border rounded"> <h2 id="card-title" className="text-lg font-semibold scroll-mt-16">{title}</h2> <p className="break-words">Safe content</p> </article> ); } ``` All guidelines have been satisfied in this component. Output the compliance report for this clean file.
| Checked | Without skill | With skill |
|---|---|---|
| Outputs pass indicator under header for src/components/CleanCard.tsx | Missed | Passed |
| Includes pass status indicator | Passed | Passed |
The instructions your model reads when the skill loads.
Review files for compliance with Web Interface Guidelines.
file:line formatWhen a user provides a file or pattern argument:
If no files specified, ask the user which files to review.
Review these files for compliance: $ARGUMENTS
Read files, check against rules below. Output concise but comprehensive—sacrifice grammar for brevity. High signal-to-noise.
aria-label<label> or aria-labelonKeyDown/onKeyUp)<button> for actions, <a>/<Link> for navigation (not <div onClick>)alt (or alt="" if decorative)aria-hidden="true"aria-live="polite"<button>, <a>, <label>, <table>) before ARIA<h1>–<h6>; include skip link for main contenttest cases passed, vs 4 / 22 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.