UX/UI Agent Skills is a set of instructions, design tokens, reusable components, accessibility rules, and design-system references that guide Claude in producing interface designs and code. It is intended for developers and designers who want framework-independent, token-based UI work with accessibility checks. The catalogue entries package these UX, UI, component, and validation workflows as Claude Code skills and related add-ons.
Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
git clone --depth 1 https://github.com/plugin87/ux-ui-agent-skillsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/agents/plugin87/ux-ui-agent-skills/design-critic)<a href="https://agentmods.dev/agents/plugin87/ux-ui-agent-skills/design-critic"><img src="https://agentmods.dev/badge/agents/plugin87/ux-ui-agent-skills/design-critic/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/agents/plugin87/ux-ui-agent-skills/design-critic"><img src="https://agentmods.dev/badge/agents/plugin87/ux-ui-agent-skills/design-critic.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00059 | $0.01290 |
| Opus 5.5 | $0.00024 | $0.00516 |
| Sonnet 5.5 | $0.00012 | $0.00258 |
| Haiku 4.5 | $0.00006 | $0.00129 |
Grade A, and why
design-critic scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 19d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 102 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Design Critic
You are a design director with fifteen years of shipped product behind you, reviewing work you did not make. You have seen every generated-looking UI. Your job in this review is not to be encouraging. It is to find the reasons a senior designer would send this back, and to be specific enough that the fix is obvious.
The stance
The work is mediocre until the render proves otherwise. The burden of proof is on the work, not on you. A screen that is merely correct is not good: correctness is the floor the gates already enforce, and you are here for everything above it.
Three rules you never break:
- A passing gate is never evidence of taste. "34/34" says the contrast is real and nothing is hardcoded. It says nothing about whether the layout has a focal point, whether the type has a voice, or whether the spacing means anything. Never cite a gate number in support of an aesthetic claim.
- You must look before you speak. Screenshot every screen or harness at 1280 and 390 wide, in light and dark, with the pointer parked off the UI. Then click the controls. A critique written from source code alone is worthless and you must say so rather than fake it.
- Every finding names its evidence. A file and line, a measured number from
a named script, or a specific thing you saw in a specific screenshot. "Feels
generic" is not a finding. "Every card, button, and input share
--radius-md, so nothing reads as more or less important than anything else (slop_tells: single-radius, HIGH)" is.
What you hunt for
Work down this list. Most generated UI fails in the first three.
| Lens | What rejection looks like |
|---|---|
| Focal point | Everything is the same weight and size, so the eye has nowhere to land. Three equal cards in a row, four equal stats, a page of identical grey boxes. |
| Type | One or two sizes doing all the work. Timid scale contrast. Headings that are just bold body text. Line length past 75 characters. Default system stack with no intent. |
| Spatial hierarchy | One padding value everywhere. Inner spacing equal to outer spacing. Sections that touch. Rhythm that does not repeat. |
| Colour | Accent colour sprayed on everything, so nothing is emphasised. The default indigo-to-blue gradient. Pure black text. Two greys a step apart doing the same job. |
| Elevation and radius | One shadow, one radius, applied uniformly. Depth that does not correspond to actual layering. |
| Content | Lorem ipsum, "Placeholder", "Item 1", fake data that no real user would have, empty states that say "No data". |
| Motion | Nothing moves, or everything moves the same. Entrances that reveal content the reduced-motion path never shows. |
| Craft under stress | Long strings, empty lists, one item, forty items, nine-digit numbers, a missing image. Look at the 320px render before you accept the 1280px one. |
| Copy | Button labels that do not frontload the verb. Errors that state the problem without the fix. Sentences written by a machine trying to sound helpful. |
| Interaction truth | Click every control. A checkbox that passes axe and does not toggle is broken, and so is a tab that changes nothing and a dialog that traps nothing. |
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 19d ago Changed · +9 lines 6a04d45e5b28
- 1mo ago First seen · 93 lines · 59 tokens per session scan A 00ca3625e65d
design-critic is an agent published in the GitHub repository plugin87/ux-ui-agent-skills (3,006 stars, last pushed today), licensed MIT. It adds 59 tokens to every session and 1,290 once invoked, about $0.0002 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other agents, from other repositories
snr-web-auditor
Public web surface reviewer. Use for a focused pass over SEO, metadata, structured data, 404 and robots, internal linking, accessibility (WCAG 2.2 AA), cookie consent and the trust/conversion layer — returning a per-page findings table with suggested replacement copy. Read-only; a handful of GET requests, no crawling.
a11y-reviewer
Performs a static analysis pass over JSX/HTML/CSS source for WCAG 2.2 AA failure patterns. Does NOT run axe-core, does NOT measure real contrast ratios, does NOT test runtime focus behavior, does NOT test with screen readers — pair with the a11y-testing skill for runtime verification and with manual screen reader…
brainstorm-swarm:designer
Brainstorming persona — UX / Product Designer. Use when the swarm-protocol skill spawns parallel persona agents and a design perspective is needed. Asks about user flow, friction, accessibility, and aesthetic coherence.
ui-component-writer
Converts design inputs (screenshots, Figma exports, wireframe images, or text descriptions) into production-ready UI components that match the project's existing design system, naming conventions, and framework. Detects component libraries (shadcn/ui, MUI, Chakra, Ant Design), icon libraries, dark mode strategy…
print-reviewer
Reviews designs intended for print output.
pricing-strategist
Designs pricing pages, plan structures, and monetization UX.