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.
git clone --depth 1 https://github.com/Adityaraj0421/naksha-studioWrote 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/adityaraj0421/naksha-studio/figma-component-library)<a href="https://agentmods.dev/commands/adityaraj0421/naksha-studio/figma-component-library"><img src="https://agentmods.dev/badge/commands/adityaraj0421/naksha-studio/figma-component-library.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.1 | $0.00035 | $0.03699 |
| Opus 5 | $0.00017 | $0.01850 |
| Sonnet 5 | $0.00007 | $0.00740 |
| Haiku 4.5 | $0.00003 | $0.00370 |
Grade A, and why
figma-component-library 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 7d 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 — 393 lines — stays where its author put it; the contents beside it link to each section on GitHub.
/figma-component-library
Generate an entire component library in Figma — atoms → molecules → organisms — from a design system config or a description. Produces named components with auto layout, variant groups, component properties, and correct layer naming conventions.
Usage: /figma-component-library <description or config>
Examples:
/figma-component-library SaaS product with blue primary, minimal style/figma-component-library e-commerce: product cards, cart, checkout forms/figma-component-library --config design-tokens.json/figma-component-library --scope atoms— generate only atom-level components
Flags:
--scope atoms | molecules | organisms | full(default: full)--style minimal | bold | corporate | playful | dark-tech(default: minimal)--config <file>— read color/typography tokens from a JSON file--framework— output companion React/TypeScript interface spec alongside Figma output
Step 1: Parse Input
Extract from $ARGUMENTS:
- Product context: What is being built? (SaaS, e-commerce, dashboard, mobile app, etc.)
- Brand signals: Any color, style, or tone mentioned → use as seed for token generation
- Scope flag:
--scopedetermines which tiers to generate - Config file: If
--configis provided, read token values; otherwise generate sensible defaults - Style flag: Maps to a visual personality (see style table in Step 2)
If no brand color is provided, default to a neutral blue (#3B82F6) with slate grays.
Step 2: Generate Token Foundation
Before building components, establish the token system that all components will reference.
Color Tokens
Generate a complete semantic token set from the brand color:
--color-brand-50 through --color-brand-900 (tints/shades)
--color-neutral-50 through --color-neutral-950
Semantic aliases:
--color-interactive (brand-600 default)
--color-interactive-hover (brand-700)
--color-interactive-active (brand-800)
--color-interactive-subtle (brand-50)
--color-surface (#ffffff)
--color-surface-raised (neutral-50)
--color-surface-overlay (neutral-100)
--color-border (neutral-200)
--color-border-strong (neutral-400)
--color-text-primary (neutral-900)
--color-text-secondary (neutral-600)
--color-text-disabled (neutral-400)
--color-text-inverse (#ffffff)
--color-focus-ring (brand-600 + 25% alpha)
--color-success (#22c55e)
--color-warning (#f59e0b)
--color-error (#ef4444)
--color-info (brand-500)
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.
- 7d ago First seen · 393 lines · 35 tokens per session scan A d5257b8d3c97
figma-component-library is a command published in the GitHub repository Adityaraj0421/naksha-studio (316 stars, last pushed 2mo ago), licensed MIT. It adds 35 tokens to every session and 3,699 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-30.
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.
theme-swap
Recolour an extracted site's design around a new brand primary. OKLCH hue rotation preserves perceptual lightness — neutrals, type, spacing, and motion stay untouched. Side-by-side HTML preview + recoloured tokens (DTCG, Tailwind, shadcn, Figma).
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.
fidelity
Measure how faithfully a clone reproduces a site — pixel-diff plus motion-fidelity into one 0-100 score, a letter grade, a ranked correction plan, and a shareable card.
site
Crawl a whole site and synthesize ONE canonical design system across all pages — unified tokens, coverage map, consistency grade.