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 45ck/skill-harness --skill figma-implementation-planninggit clone --depth 1 https://github.com/45ck/skill-harnessWrote 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/45ck/skill-harness/figma-implementation-planning)<a href="https://agentmods.dev/skills/45ck/skill-harness/figma-implementation-planning"><img src="https://agentmods.dev/badge/skills/45ck/skill-harness/figma-implementation-planning/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/45ck/skill-harness/figma-implementation-planning"><img src="https://agentmods.dev/badge/skills/45ck/skill-harness/figma-implementation-planning.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.00029 | $0.00269 |
| Opus 5.5 | $0.00012 | $0.00108 |
| Sonnet 5.5 | $0.00006 | $0.00054 |
| Haiku 4.5 | $0.00003 | $0.00027 |
Grade A, and why
figma-implementation-planning 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 1mo 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
Use this skill when turning a design into code work.
Process:
- identify the screen, component, or node scope being implemented
- break the design into reusable components, one-off layout regions, and stateful elements
- capture important behavior: empty states, hover/focus, disabled states, loading, and responsive shifts
- map visual structure to implementation boundaries without overfitting to layer names
- note where the design is ambiguous and what assumption is being made
- keep a durable design brief, state spec, or implementation note as canonical source
- recommend a high-fidelity generated review surface when humans need to inspect realistic UI behavior, data density, or workflow states
- treat low-fidelity sketches as scratch only unless they are explicitly recorded as research evidence
Deliver:
- component breakdown
- state and variant list
- responsive or layout constraints
- implementation sequence
- canonical source path and generated review path when a visual artifact is needed
- open questions that need design clarification
Avoid:
- treating screenshots as complete requirements
- copying visual details without considering state or content behavior
- inventing a component hierarchy that the codebase cannot support
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.
- 1mo ago First seen · 33 lines · 29 tokens per session scan A d1c63de4a5c1
figma-implementation-planning is a skill published in the GitHub repository 45ck/skill-harness (15 stars, last pushed 4mo ago), licensed MIT. It adds 29 tokens to every session and 269 once invoked, about $0.0001 per session on Opus 5.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-30.
Other skills, from other repositories
Art
Static visual content across 20+ formats — diagrams, mermaid, infographics, D3 dashboards, comics, icons, wallpaper — via Flux, Nano Banana Pro, and GPT-Image-2. USE WHEN art, illustration, diagram, flowchart, infographic, header image, blog social thumbnail, visualize, generate image, mermaid, architecture diagram…
Webdesign
Design and integrate web interfaces via three paths: DirectDesign (write design inline with Anthropic frontend-design philosophy — the default workhorse), native /design + /design-sync Claude Code commands (preferred for code integration and design-system sync), or ClaudeDesign (drive claude.ai/design through…
prototype
Build a throwaway prototype to flush out a design before committing to it. Routes between two branches — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route. Use when the user wants to prototype, sanity-check a data model or state machine…
dxf
Generate, regenerate, and validate 2D DXF drawings from Python build123d sources. Use for DXF files, .py drawing scripts, @dxf models, 2D profiles, outlines, templates, gaskets, panels, flat patterns, laser/plasma/waterjet cut layouts, and 2D drawing exports of CAD geometry. Open and visually review existing DXF files…
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.
decocms-ui
Build or style React UI with the decocms product design system (@decocms/ui). Use when creating a new screen, page, or component that should look like decocms products, when the user mentions "design system", "@decocms/ui", "decocms style", or asks to make UI consistent with Studio. Covers screen layout (width…