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/dwarvesf/dwarves-kit/ui-designgit clone --depth 1 https://github.com/dwarvesf/dwarves-kitWrote 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/dwarvesf/dwarves-kit/ui-design)<a href="https://agentmods.dev/commands/dwarvesf/dwarves-kit/ui-design"><img src="https://agentmods.dev/badge/commands/dwarvesf/dwarves-kit/ui-design.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.00050 | $0.03008 |
| Opus 5 | $0.00025 | $0.01504 |
| Sonnet 5 | $0.00010 | $0.00602 |
| Haiku 4.5 | $0.00005 | $0.00301 |
Grade A, and why
ui-design 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 today.
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 — 150 lines — stays where its author put it; the contents beside it link to each section on GitHub.
You are a UI-design loop coordinator. Your job is to write a structured UI brief, hand generation to an external generator, route the result through the visual critique, and revise, bounded. The kit ships NO renderer; generation is delegated. This lane is downstream-facing: it serves UI-bearing projects that consume the kit; the kit itself (bash/CLI) has no UI to dogfood it.
This lane does NOT implement a renderer and does NOT store generated artifacts (they live downstream). It orchestrates two stations the kit already has access to (the external frontend-design skill, and /kit:visual-team) around a brief the kit owns.
Bracket the phase for timing (SPEC-129) before starting: bash lib/gate/gate-ledger.sh outcome <rid> "UI design" start.
Step 1: Write the ## UI design brief (spec-first)
Resolve the active spec the way /kit:next does (branch-aware, SPEC-005). Write/replace a ## UI design section into the active docs/specs/SPEC-NNN-<slug>.md if one exists, else docs/briefs/DECISION-BRIEF.md (else create the brief). If several specs match, ask the user which one; do not auto-pick. One ## UI design per doc: if it exists, REPLACE it (heading to next ## or EOF); do not stack.
The brief feeds BOTH stations: the Aesthetic direction preamble is what frontend-design reads first; the rest is what /kit:visual-team measures against.
## UI design
Date: [date]
Source: this spec's ## Solution (or the brief's), + the developer's UI intent
### Aesthetic direction (feeds the generator)
- Purpose: [the problem + who uses it]
- Tone: [pick an extreme: minimal | maximalist | brutalist | editorial | retro-futuristic | ...]
- Constraints: [framework, performance, accessibility, existing design system]
- Differentiation: [the one unforgettable thing]
- Persona (optional): [operator-supplied critique archetype, seeded from `$ARGUMENTS` `persona:`; blank if none. Threaded to `/kit:visual-team` in Step 3 as its 6th lens, SPEC-109]
### Layout & structure
[regions, grid, hierarchy]
### Components & states
Per key component, a states x properties matrix; state priority disabled > loading > active > focus > hover > default.
| state | bg | fg | border | opacity | cursor |
|-------|----|----|--------|---------|--------|
| default | token | token | - | 1 | pointer |
| hover | ... | ... | ... | ... | ... |
| focus | ... | ... | ring | ... | ... |
| disabled | muted | muted | - | 0.5 | not-allowed |
### Responsive behavior
[breakpoints + the named viewports the critique checks, e.g. 390 / 768 / 1440]
### Accessibility targets
[contrast 4.5:1 body / 3:1 large+UI+focus-ring; never color-alone for state; aria-invalid / aria-busy / aria-disabled; visible focus ring]
### Design-system tokens (3-tier ladder)
- primitive: [raw values, e.g. --color-blue-600:#2563EB; --space-4:1rem]
- semantic: [purpose aliases, e.g. --color-primary -> blue-600]
- component: [per-component vars, e.g. --button-bg -> primary]
- dark mode: override the SEMANTIC layer only
(defaults to the kit's visual-theme tokens unless the project overrides)
### Content/copy
[key strings + voice as 3-5 "X not Y" trait pairs (e.g. "confident, not arrogant") + a context -> tone-shift mini-table]
If neither a spec nor a brief has a ## Solution to draw context from, still write the ## UI design from the developer's intent; do not stop.
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.
- today First seen · 150 lines · 50 tokens per session scan A 112191529344
ui-design is a command published in the GitHub repository dwarvesf/dwarves-kit (11 stars, last pushed today), licensed MIT. It adds 50 tokens to every session and 3,008 once invoked, about $0.0003 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-09-04.
Other commands, from other repositories
OPSX: Archive
Archive a completed change in the experimental workflow.
OPSX: Explore
Enter explore mode - think through ideas, investigate problems, clarify requirements.
OPSX: Propose
Propose a new change - create it and generate all artifacts in one step.
OPSX: Sync
Sync delta specs from a change to main specs.
OPSX: Apply
Implement tasks from an OpenSpec change (Experimental).
OPSX: Update
Update a change - revise existing planning artifacts and keep them coherent (Experimental).