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 skills/taewooopark/uiforge/contentnpx skills add TaewoooPark/UIForge --skill contentgit clone --depth 1 https://github.com/TaewoooPark/UIForgeWrote 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/skills/taewooopark/uiforge/content)<a href="https://agentmods.dev/skills/taewooopark/uiforge/content"><img src="https://agentmods.dev/badge/skills/taewooopark/uiforge/content.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.1 | $0.00113 | $0.00957 |
| Opus 5 | $0.00056 | $0.00478 |
| Sonnet 5 | $0.00023 | $0.00191 |
| Haiku 4.5 | $0.00011 | $0.00096 |
Grade A, and why
content 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 5d 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 — 82 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Content — write the interface
Copy is a design surface, not filler poured in at the end. Users scan, don't read (NN/g: 79% scan; rewriting marketese to objective, concise, scannable copy tested +124% usability). And "words are UI" (Polaris) — labels, empty states, and errors are where a product feels human or feels generated.
Buttons & actions — state the outcome
- Verb + object, ≤ 3 words, sentence case. Never "Submit," "Click here," or "Learn more" in isolation. "Send invoice." "Create project." "Start free trial." (Intuit measured "Send invoice" vs "Submit" at +18% CTR.)
- Destructive actions = Verb + Noun ("Delete project," "Remove member") so the consequence is unmistakable — never a bare "Delete" / "OK."
- One primary action per view; secondaries are quieter in both weight and word.
Errors — what happened + how to fix
- Say what went wrong and what to do next, in plain words. No blame, no codes as the whole message, never "An error occurred."
- Preserve the user's input. Point at the field. "That email's already in use — sign in instead?" beats "Invalid input."
Empty & loading states — never blank
- Empty = why it's empty + one clear next action + a hint of the payoff. It's a first-run activation moment, not a dead end. "No projects yet. Create one to start tracking builds." + the button.
- Loading: skeletons over spinners; show nothing under ~300ms (a flash reads as a glitch); consider optimistic UI for likes/CRUD.
Headlines & marketing — the specificity test
Every headline needs ≥ 1 checkable element: a number, a name, a timeframe, or a mechanism. The test: if the line could be pasted onto a competitor's site unchanged, it's a slogan — rewrite it.
- "Ship faster" → "Deploy in under 90 seconds."
- "Powerful analytics" → "Query 10B events without a data team."
- Lead with the user's problem, not your product's adjectives (inverted pyramid — front-load the point).
The hype blocklist (ban these)
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.
- 5d ago First seen · 82 lines · 113 tokens per session scan A ddbbb118ef22
content is a skill published in the GitHub repository TaewoooPark/UIForge (7 stars, last pushed 1mo ago), licensed MIT. It adds 113 tokens to every session and 957 once invoked, about $0.0006 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 skills, from other repositories
aceternity-ui
100+ animated React components (Aceternity UI) for Next.js with Tailwind. Use for hero sections, parallax, 3D effects, or encountering animation, shadcn CLI integration errors.
tools-unity-ugui
Unity UI patterns including Canvas optimization, list virtualization, and mobile-friendly UI.
window-alert-confirm
Guidelines for using window.alert() and window.confirm() in web applications. Use when implementing error notifications or destructive action confirmations.
sparkle-that-page
Use when a user wants to add cute, playful runtime effects to a web page — a fairy-wand or magic custom cursor (star / heart / moon / pixel / sailor-moon), a sparkle / star / heart / fairy-dust trail following the mouse on move and click, an animated floating scroll-depth / scroll-progress indicator (ring, comet bar…
design-spatial
Spatial composition and layout for frontend design. Load with design when composing pages/dashboards/components, or whenever generated UI looks off — overlapping/colliding elements, weak hierarchy, or generic ("looks like every startup site"). The core idea: a model can't trust its own layout, so render it, critique…
design-tokens
This skill should be used when a user wants to scaffold or refactor a design token system — e.g. "set up design tokens", "create a design system foundation", "extract these hardcoded colors into tokens", "add a type scale", "theming setup", or "dark mode tokens". It produces a single source of truth for color, type…