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/aboudjem/ui-ux-suite/componentsgit clone --depth 1 https://github.com/Aboudjem/ui-ux-suiteWrote 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/commands/aboudjem/ui-ux-suite/components)<a href="https://agentmods.dev/commands/aboudjem/ui-ux-suite/components"><img src="https://agentmods.dev/badge/commands/aboudjem/ui-ux-suite/components.svg" alt="Measured on agentmods" 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 | $0.00029 | $0.00393 |
| Opus 5 | $0.00015 | $0.00197 |
| Sonnet 5 | $0.00006 | $0.00079 |
| Haiku 4.5 | $0.00003 | $0.00039 |
Grade A, and why
components 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 3d 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
/ui-ux-suite:components — Component-quality audit
Scoped audit on component patterns.
What you do
- Resolve project path.
- Call
uiux_audit_runwithdimensions: ["components", "interaction"]. Component quality and interaction polish are coupled in practice. - Present the component section of the report.
- Glob
src/components/ui/**(orcomponents/ui/**) to count primitives if the report flags a low primitive count.
What component audit covers
- Presence of a
cn()/clsx()/twMergeutility - CVA (
class-variance-authority) variant pattern - shadcn/ui primitives count (via
components.json) - Radix / Headless UI / Ark UI usage (a11y-primitive signal)
- State coverage from className:
hover:,focus:,focus-visible:,active:,disabled:,dark:,group-hover: - Inline-component duplication heuristic (same button styles repeated 5+ times → missing primitive)
- Icon library presence (lucide-react, heroicons, phosphor-icons, @radix-ui/react-icons)
Don't count <div> as "low component quality" — devs use divs for layout intentionally. Focus on primitive reuse and state coverage.
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.
- 3d ago First seen · 30 lines · 29 tokens per session scan A 32ee268d1e03
components is a command published in the GitHub repository Aboudjem/ui-ux-suite (7 stars, last pushed 3mo ago), licensed MIT. It adds 29 tokens to every session and 393 once invoked, about $0.0001 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-31.
Other commands, from other repositories
brand
Generate a full editorial brand-guidelines book for any URL. 14 chapters covering brand essence/archetype, colour, typography, spacing, shape, iconography, motion, components, voice, accessibility, tokens, and how-to-use guidance. Print-ready, dark-mode toggle, hand-off-ready single HTML.
pair
Fuse two extracted designs into a single hybrid identity. Pick which axis (colour, typography, spacing, shape, motion, voice, components) comes from which site. Defaults to "visual A × voice B" — same colours/spacing as the first URL, type/voice/components from the second.
theme-swap
Recolour an extracted site's design around a new brand primary. OKLCH hue rotation preserves perceptual lightness — neutrals, type, spacing, and motion stay untouched. Side-by-side HTML preview + recoloured tokens (DTCG, Tailwind, shadcn, Figma).
dna
Place a design in the measured design space — nearest systems, per-axis percentiles, outliers.
extract
Extract the complete design language from a URL — DTCG tokens, Tailwind, Figma vars, motion, voice, components.
fidelity
Measure how faithfully a clone reproduces a site — pixel-diff plus motion-fidelity into one 0-100 score, a letter grade, a ranked correction plan, and a shareable card.