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 skills add thewolffish/wolffish-app --skill web-designgit clone --depth 1 https://github.com/thewolffish/wolffish-appWrote 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/thewolffish/wolffish-app/web-design)<a href="https://agentmods.dev/skills/thewolffish/wolffish-app/web-design"><img src="https://agentmods.dev/badge/skills/thewolffish/wolffish-app/web-design/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/skills/thewolffish/wolffish-app/web-design"><img src="https://agentmods.dev/badge/skills/thewolffish/wolffish-app/web-design.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.00045 | $0.00519 |
| Opus 5 | $0.00023 | $0.00260 |
| Sonnet 5 | $0.00009 | $0.00104 |
| Haiku 4.5 | $0.00005 | $0.00052 |
Grade A, and why
web-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 9d 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
Web Design
A core capability. Its one tool, web_design, returns the web design manual: the
treatment-calibration and section-map planning steps, the rail-and-column page
architecture, dual light/dark theme tokens (system preference plus toggle override),
type voices built from system font stacks, the component kit (cover plate, index
rail, notes, figure plates, hairline tables, pills, card grids, Q&A, steps,
checklists), hand-drawn SVG figure rules, the JS-as-enhancement doctrine (pages must
read complete with scripts off), RTL/Arabic rules, and the mandatory
browser_screenshot + image_view verify loop.
The manual itself lives in manual.md beside this file; the plugin reads and returns
it. The core contract (agents.core.md) tells you to call web_design before
authoring any web page — this capability is what delivers it. Explicit user or
automation design instructions always take precedence over the manual. Documents
meant to print or ship as a PDF are pdf_design's job, not this capability's.
What ships with it
2 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
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.
- 9d ago First seen · 42 lines · 45 tokens per session scan A 92ae1fd13095
web-design is a skill published in the GitHub repository thewolffish/wolffish-app (5 stars, last pushed 2d ago), licensed MIT. It adds 45 tokens to every session and 519 once invoked, about $0.0002 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
agent-computer-use
REQUIRED for any task that involves operating a desktop application — opening apps, clicking buttons, typing into fields, pressing keys, scrolling, dragging, reading what's on screen, moving or resizing windows, or verifying state after an action. Always use the agent-cu CLI commands (open, snapshot, click, type, key…
claude-api
Build, debug, and optimize Claude API / Anthropic SDK apps. Apps built with this skill should include prompt caching. Also handles migrating existing Claude API code between Claude model versions (4.5 → 4.6, 4.6 → 4.7, retired-model replacements). TRIGGER when: code imports anthropic/@anthropic-ai/sdk; user asks for…
create-skill
Create new skills, modify and improve existing skills, and measure skill performance. Use when users want to create a skill from scratch, edit, or optimize an existing skill, run evals to test a skill, benchmark skill performance with variance analysis, or optimize a skill's description for better triggering accuracy.
figma-create-design-system-rules
Generates custom design system rules for the user's codebase. Use when user says "create design system rules", "generate rules for my project", "set up design rules", "customize design system guidelines", or wants to establish project-specific conventions for Figma-to-code workflows. Requires Figma MCP server…
figma-generate-design
Use this skill alongside figma-use when the task involves translating an application page, view, or multi-section layout into Figma. Triggers: 'write to Figma', 'create in Figma from code', 'push page to Figma', 'take this app/page and build it in Figma', 'create a screen', 'build a landing page in Figma', 'update the…
figma-generate-library
Build or update a professional-grade design system in Figma from a codebase. Use when the user wants to create variables/tokens, build component libraries, set up theming (light/dark modes), document foundations, or reconcile gaps between code and Figma. This skill teaches WHAT to build and in WHAT ORDER — it…