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/fusengine/agents/design-webnpx skills add fusengine/agents --skill design-webgit clone --depth 1 https://github.com/fusengine/agentsWrote 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/fusengine/agents/design-web)<a href="https://agentmods.dev/skills/fusengine/agents/design-web"><img src="https://agentmods.dev/badge/skills/fusengine/agents/design-web.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.00036 | $0.03100 |
| Opus 5 | $0.00018 | $0.01550 |
| Sonnet 5 | $0.00007 | $0.00620 |
| Haiku 4.5 | $0.00004 | $0.00310 |
Grade A, and why
design-web 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 yesterday.
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 — 180 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Covers hero discipline (headline/subhead word caps, single primary CTA), body-sequence selection against the canonical-order default, asymmetric grids instead of a uniform 3-column layout, and a set of mechanical anti-slop flags (uniform grids, uniform padding, the AI-signature entrance motion, the reflex blue/Inter/rounded-2xl combo).
Declares the three reproduced elements (Je reproduis, corpus procedures vs sector register) that design-review verdicts, and runs the silhouette Lookalike Test before the page can be called done: a fail is structural and goes back to the hero/body picks, not to a cosmetic tweak.
Design Web — Marketing & Landing, Register Brand
When
After design-system tokens exist and design-method's Gate 0 has locked register
brand (one dominant, expressive message). Read design-method's routing table first —
a dashboard/app/utility surface routes to design-webapp instead. Exception: a
marketing-adjacent surface living inside an app shell (e.g. an in-app pricing page) still
routes here for that one page (see design-webapp's reciprocal note).
Input
design-system.md— OKLCH palette, type pair, spacing density, the 3 dials.../design-method/references/register/brand.md— the page's POV sentence and the per-section Competitor Lift Test (loaded once per task, not re-read per step).- The
generatemove report (../design-method/references/moves/generate.md) if this task started from Gate 0 — steps 1-4 of that report (register, inspiration, tokens, and step 4's two picks: hero treatment + body sequence) are inputs here, not repeated.
Steps
- Structure comes from register + two structural picks, never from template
reproduction.
references/design-inspiration.mdsources taste in a fixed order: the local corpus (references/refs-design/, fifteen rebuilt pages whosetokens-*.mdcarry measured procedures) supplies palette, typography, depth and craft; 1-2 real production sites in the client's own sector supply register only — vocabulary, codes, level of formality. Section flow, spacing rhythm and layout are never copied from either. The actual skeleton is the pair named indesign-method'sgeneratemove: a hero treatment from../design-method/references/macrostructure-bank.md(first screen only — it decides nothing past the fold) plus a body sequence from../design-method/references/body-sequence-bank.md, both filtered through the POV inregister/brand.md. Naming one without the other is an incomplete plan. Reproducing an inspiration site's structure verbatim is the single biggest source of templated output — treat it as a hard boundary, not a style preference.
What ships with it
60 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.
- references/21st-dev.md 3.7 KB
- references/buttons-guide.md 4.6 KB
- references/cards-guide.md 6.1 KB
- references/component-composition-ref.md 2.7 KB
- references/component-examples.md 1.9 KB
- references/component-variants-ref.md 2.6 KB
- references/design-inspiration-urls.md 4.9 KB
- references/design-inspiration.md 17 KB
- references/design-patterns.md 8.3 KB
- references/forms-guide.md 5.5 KB
- references/gemini/gemini-design-workflow.md 3.9 KB
- references/gemini/gemini-feedback-loop.md 2.7 KB
- references/gemini/gemini-tool-signatures.md 2.6 KB
- references/grids-layout.md 6.0 KB
- references/icons-guide.md 4.7 KB
- references/layout-discipline.md 6.1 KB
- references/layouts/navigation/footer.md 2.6 KB
- references/layouts/navigation/mobile-nav.md 2.9 KB
- references/layouts/navigation/navbar.md 2.7 KB
- references/layouts/navigation/sidebar.md 2.8 KB
- references/layouts/page-architecture.md 3.0 KB
- references/photos-images.md 19 KB
- references/premium-patterns/01-numbered-services/description.md 4.1 KB
- references/premium-patterns/02-alternating-sections/description.md 6.9 KB
- references/premium-patterns/03-hero-badge-inline/description.md 3.5 KB
- references/premium-patterns/04-bento-grid/description.md 4.7 KB
- references/premium-patterns/05-fullbleed-hero/description.md 4.4 KB
- references/premium-patterns/06-gradient-steps/description.md 3.6 KB
- references/premium-patterns/07-cta-giant-typography/description.md 3.5 KB
- references/premium-patterns/08-radical-alternation/description.md 4.2 KB
- references/premium-patterns/09-tabs-image-swap/description.md 4.3 KB
- references/premium-patterns/10-accordion-carousel/description.md 6.4 KB
- references/premium-patterns/PATTERNS.md 12 KB
- references/reference-index.md 5.1 KB
- references/refs-design/cursor-recode/design-system.md 9.2 KB
- references/refs-design/cursor-recode/index.html 113 KB
- references/refs-design/cursor-recode/motion-nav.js 7.2 KB runs code
- references/refs-design/cursor-recode/motion-scroll.js 7.6 KB runs code
- references/refs-design/cursor-recode/motion.js 4.3 KB runs code
- references/refs-design/cursor-recode/styles.css 99 KB
- references/refs-design/cursor-recode/tokens-cursor.md 31 KB
- references/refs-design/dispatch-recode/design-system.md 8.8 KB
- references/refs-design/dispatch-recode/img/glow.webp 28 KB
- references/refs-design/dispatch-recode/img/hero.webp 38 KB
- references/refs-design/dispatch-recode/img/nebula.webp 313 KB
- references/refs-design/dispatch-recode/img/trails.webp 122 KB
- references/refs-design/dispatch-recode/index.html 39 KB
- references/refs-design/dispatch-recode/motion.js 9.6 KB runs code
- references/refs-design/dispatch-recode/styles.css 41 KB
- references/refs-design/dispatch-recode/tokens-dispatch.md 39 KB
- references/refs-design/endlesstools-recode/design-system.md 9.6 KB
- references/refs-design/endlesstools-recode/index.html 47 KB
- references/refs-design/endlesstools-recode/motion.js 9.2 KB runs code
- references/refs-design/endlesstools-recode/styles.css 34 KB
- references/refs-design/endlesstools-recode/tokens-endlesstools.md 25 KB
- references/refs-design/fora-recode/design-system.md 8.3 KB
- references/refs-design/fora-recode/index.html 35 KB
- references/refs-design/fora-recode/motion.js 21 KB runs code
- references/refs-design/fora-recode/styles.css 70 KB
- references/refs-design/fora-recode/tokens-fora.md 34 KB
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.
- yesterday First seen · 180 lines · 36 tokens per session scan A 0f310abbfa90
design-web is a skill published in the GitHub repository fusengine/agents (25 stars, last pushed 1mo ago), licensed MIT. It adds 36 tokens to every session and 3,100 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-09-03.
Other skills, from other repositories
designing-interfaces
Creates a design system for software with a UI. Use when a project has a user interface and architecture is confirmed — whether creating from scratch or extracting patterns from existing code.
evaluate
Run accessibility checks and discover issues mapped to WCAG criteria.
guidelines
Package all brand elements into a complete brand guidelines document.
visual
Define visual identity — colors, typography, logo usage, and imagery style.
report
Generate a structured accessibility audit report with remediation guidance.
a11y
Review work through the lens of an accessibility specialist.