Getting it into your agent
This one installs as part of its plugin. Adding the marketplace and installing the plugin brings it with everything else the plugin ships.
/plugin marketplace add atretyak1985/swarmery/plugin install design-packWrote 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/atretyak1985/swarmery/design-verify)<a href="https://agentmods.dev/skills/atretyak1985/swarmery/design-verify"><img src="https://agentmods.dev/badge/skills/atretyak1985/swarmery/design-verify/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/atretyak1985/swarmery/design-verify"><img src="https://agentmods.dev/badge/skills/atretyak1985/swarmery/design-verify.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.00074 | $0.01994 |
| Opus 5 | $0.00037 | $0.00997 |
| Sonnet 5 | $0.00015 | $0.00399 |
| Haiku 4.5 | $0.00007 | $0.00199 |
Grade A, and why
design-verify 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.
How it starts
The opening of the file, as written. The whole thing — 167 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Purpose
Phase 6 of design-implement, and the only place the measurement procedure is written down.
Mechanical on purpose: six steps, run in order, every one of them producing something the
operator can see.
1. Get a live target
Check that the app answers on design.devUrl. If it does not, start design.devCommand in the
background, wait until the URL answers, and record that this process has to be stopped when
verification finishes — a dev server left running outlives the task and confuses the next one.
Never point verification at a production origin. The target is the local dev URL from
design.devUrl plus the route under test.
2. Run the diff
$SCRIPTS_DIR is the one resolved in design-implement Step 0.3
(${CLAUDE_PLUGIN_ROOT}/scripts inside the pack, the skill's own scripts/
directory inside a standalone bundle).
node "$SCRIPTS_DIR/screenshot-diff.mjs" \
--design <design path> \
--url <design.devUrl + route> \
--viewport <authoring viewport> \
--threshold <design.diff.threshold> \
--pixel-tolerance <design.diff.pixelTolerance> \
--out .design-verify/report/<slug>
The viewport is the authoring breakpoint carried over from Phase 2, not a convenient one. Add
--full-page when the screen is taller than the viewport and the part below the fold is in
scope.
Exit codes: 0 ok, 1 bad arguments or unreadable input, 2 runtime failure (the render
failed, or the URL was unreachable — check step 1 before blaming the diff), 3 the render
runtime is not prepared: run ensure-runtime.mjs once while online, see design-implement
Step 0.3.
Artefacts written to the output directory: design.png, impl.png, diff.png,
side-by-side.png, report.json.
3. Read report.json — regions before verdict
pass is a global percentage, and a global percentage cannot see small geometric drift.
Measured on this pack's own runtime: a real 2px element shift scored diffPercent 0.02 against
a threshold of 0.5 — that is pass: true on a screen that is visibly wrong.
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 · 167 lines · 74 tokens per session scan A eb331ba5178a
design-verify is a skill published in the GitHub repository atretyak1985/swarmery (6 stars, last pushed 2d ago), licensed Apache-2.0. It adds 74 tokens to every session and 1,994 once invoked, about $0.0004 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
brand-landingpage
Brand-first landing page designer — runs a brand-identity interview (colors, typography, shape language), then generates and iterates on a polished landing page via Stitch with deployment-ready HTML. Use when the user asks to create, design, or build a landing page, homepage, or marketing page and has no established…
smui
Local copy of the smui ("spacemolt") design system ( ), adapted for the CAD Viewer. smui is a Nord-inspired terminal aesthetic for shadcn/ui with light and dark modes: sharp edges, monospace everything. Read this whole document before restyling viewer UI.
web-animation-design
Design and implement web animations that feel natural and purposeful. Use this skill proactively whenever the user asks questions about animations, motion, easing, timing, duration, springs, transitions, or animation performance. This includes questions about how to animate specific UI elements, which easing to use…
frontend-ui-dark-ts
Build dark-themed React applications using Tailwind CSS with custom theming, glassmorphism effects, and Framer Motion animations. Use when creating dashboards, admin panels, or data-rich interfaces with a refined dark aesthetic.
openkb-html-critic
Use to review a generated HTML deck or single-page artifact for visual quality and structural correctness. Especially good at catching CSS specificity bugs where slide-modifier classes (.divider, .center, .q, .flow etc.) accidentally override the base .slide{display:none} and cause one slide to stack on top of every…
shadcn-ui
Provides complete shadcn/ui component library patterns including installation, configuration, and implementation of accessible React components. Use when setting up shadcn/ui, installing components, building forms with React Hook Form and Zod, customizing themes with Tailwind CSS, or implementing UI patterns like…