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/abdulkader-safi/wp-to-code/wp-measuregit clone --depth 1 https://github.com/Abdulkader-Safi/wp-to-codeWrote 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/abdulkader-safi/wp-to-code/wp-measure)<a href="https://agentmods.dev/commands/abdulkader-safi/wp-to-code/wp-measure"><img src="https://agentmods.dev/badge/commands/abdulkader-safi/wp-to-code/wp-measure.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.00019 | $0.00578 |
| Opus 5 | $0.00010 | $0.00289 |
| Sonnet 5 | $0.00004 | $0.00116 |
| Haiku 4.5 | $0.00002 | $0.00058 |
Grade A, and why
wp-measure 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 3d 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 — 49 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Measure the page the user named: $ARGUMENTS.
NODE_PATH="${CLAUDE_PLUGIN_DATA}/node_modules" \
node "${CLAUDE_PLUGIN_ROOT}/scripts/measure.mjs" \
--page <slug> --side original --mode tree [--viewport 1440]
Modes
| Mode | Use it for |
|---|---|
sections |
First look at a page. Top-level blocks with height, top, padding, background. |
tree |
Writing a section. Every element with text or an image, with rect, font, margin, padding. |
content |
Text, image URLs, hrefs, alt text. Nothing about geometry. |
interactive |
Inventory of sliders, menus, accordions, forms and video that need behaviour reimplemented. |
Run sections first. Only run tree for the section you are about to write.
Context discipline
The dump goes to a file under .wp-to-code/measure/. The command prints a summary; that summary is usually all you need.
Never read a whole tree dump into the conversation. A 3000px section is tens of thousands of tokens and it will stall the session. Query the file instead:
# every element inside one section, height and font only
jq '.nodes[] | select(.path | startswith("section:nth-child(4)"))
| {path, text, h: .rect.height, size: .font.size, lh: .font.lineHeight}' \
.wp-to-code/measure/home-original-1440-tree.json
# what line-heights are actually in use
jq -r '.nodes[].font | "\(.size)/\(.lineHeight)"' <file> | sort -u
Print only what you are about to act on.
Reading geometry
Take line-height from the measurement, never from a named token. A lineHeight: "normal" in the dump resolves to roughly 1.5x the font size, and designs rarely want that. Every normal in the summary is a value you need to check against the original rather than inherit.
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.
- 3d ago First seen · 49 lines · 19 tokens per session scan A d0a9f4ee8ef3
wp-measure is a command published in the GitHub repository Abdulkader-Safi/wp-to-code (2 stars, last pushed 15d ago), licensed MIT. It adds 19 tokens to every session and 578 once invoked, about $0.0001 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 commands, from other repositories
brand
Generate a full editorial brand-guidelines book for any URL. 14 chapters covering brand essence/archetype, colour, typography, spacing, shape, iconography, motion, components, voice, accessibility, tokens, and how-to-use guidance. Print-ready, dark-mode toggle, hand-off-ready single HTML.
dna
Place a design in the measured design space — nearest systems, per-axis percentiles, outliers.
extract
Extract the complete design language from a URL — DTCG tokens, Tailwind, Figma vars, motion, voice, components.
pack
Bundle every designlang output (DTCG tokens, Tailwind, shadcn, Figma vars, motion, anatomy, Storybook, prompts) into one polished design-system directory ready to zip and ship.
verify
Fidelity check — rebuild a page from the extracted tokens, pixel-diff it against the live site, and score how faithfully the tokens capture the design.
battle
Head-to-head graded battle card between two sites — eight dimensions, bar-by-bar, verdict line.