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.
npx agentmods add commands/educlopez/ui-craft/redesigngit clone --depth 1 https://github.com/educlopez/ui-craftWhat 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 | $0.00090 | $0.00822 |
| Opus 5 | $0.00045 | $0.00411 |
| Sonnet 5 | $0.00018 | $0.00164 |
| Haiku 4.5 | $0.00009 | $0.00082 |
Grade A, and why
redesign 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 2d 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.
What it actually says
Redesign $ARGUMENTS. Load the ui-craft skill and read references/craft-intent.md. A redesign is not a greenfield build wearing the old content — most of its value is in what you deliberately keep.
Step 1 — Audit what exists (before any opinion):
- Run the detector on the current source (
npx ui-craft-detect <path>) or live page (npx ui-craft-detect <url>) and note findings. - Inventory: pages/routes, section order, heading hierarchy (h1–h3), nav structure, conversion paths (CTAs and where they lead), forms, imagery assets, fonts, color values actually in use.
- Read
.ui-craft/brief.mdif present — prior constraints still bind.
Step 2 — Classify what to preserve. Wrong-to-change unless the user explicitly asks:
- Brand equity — logo, name, an established palette the business already uses in the wild. Committed brand color stays; you may re-tune tints/shades into a proper token scale.
- IA + SEO — URLs/routes, page set, heading semantics, title/meta, alt text, structured data. A redesign that tanks organic traffic is a failure regardless of how it looks.
- Content + voice — existing copy is data about the business. Restructure freely; rewrite voice only with permission.
- Conversion paths — every CTA and form that exists today exists for a reason. Relocate, restyle, but never silently drop one.
Step 3 — Pick the scope and say it out loud:
| Scope | What changes | When |
|---|---|---|
| Refresh | Tokens only: type scale, spacing rhythm, radii, shadows, color tuning | Site is structurally fine, looks dated |
| Reskin | Visual layer + component styling; layout skeleton and section order stay | Bones are good, skin is generic or old |
| Rebuild | Layout and composition too; content, IA, and brand carry over | Layout itself is the problem |
Default to the smallest scope that fixes the stated complaint. For rebuild, print a short before/after section map and get a nod before writing code.
Step 4 — Declare the Craft Read (surface kind, audience, theme, DESIGN_VARIANCE, signature bet) per references/craft-intent.md. Redesigns default to variance 4–5: the brand is already committed, so spend boldness on typography and composition, not on a new identity.
Step 5 — Modernize with levers, in this order: typography (scale + pairing per references/typography.md) → spacing rhythm → color tokens (references/color.md) → imagery treatment → motion (entrance/hover only where focal). Fix every detector finding from Step 1 along the way.
Never: invent a new brand palette over a committed one, drop routes or pages, flatten heading semantics for looks, rewrite copy voice unasked, or ship the redesign with more detector findings than the original had.
Output: edit code directly (refresh/reskin) or section map first (rebuild). Print the Review Format table, the detector before/after counts, and end with the Craft Read line.
Next step: /critique — check the modernized surface against hierarchy and anti-slop before shipping (rung 1).
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.
- 2d ago First seen · 40 lines · 90 tokens per session scan A fe745ac0ce4e
redesign is a command published in the GitHub repository educlopez/ui-craft (298 stars, last pushed 13d ago), licensed MIT. It adds 90 tokens to every session and 822 once invoked, about $0.0005 per session on Opus 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 commands, from other repositories
a11y-scan
Scan web application components for accessibility violations against WCAG guidelines.
diagram
Generate architecture diagrams using Mermaid or ASCII art for system visualization.
hatch3r-design-system-create
Create a project design system from brand assets or an elicitation dialog — DTCG 2025.10 token emission, 3-tier taxonomy (primitive → semantic → component), OKLCH ramps, dual output design.md + design-tokens.json, gated on WCAG 2.2 AA contrast, 100% theme parity, and 0 dangling aliases.
live-canvas
Conduct design interviews, generate UI variations, and collect live click-to-annotate feedback that streams into the session so edits land without leaving the browser. Use when the user wants rapid iterative UI refinement, not just batched feedback.
product-designers
Command "product-designers" from Infrasity-Labs/dev-gtm-claude-skills, covering research & discovery, strategy & planning, ux laws & frameworks, design system and interface design.
Icon Design Review
Intelligent design analysis that automatically selects the most relevant legendary design experts for your project and user experience.