typography

typography is a skill for Claude Code, Codex from Dragoon0x/dragoon-skills. It costs 116 tokens per session (385 once invoked), scanned A, original, MIT.

A generator for reusable typography size tokens, such as CSS variables, a Tailwind configuration, or a JavaScript module. It creates nine sizes from extra-small to extra-large using a detected or default ratio.

In plain words
What is it for?
Use it to formalize an existing type system or create font tokens for a new interface.
Why use it?
It turns scattered font sizes into a consistent scale that can be reused across a project. It previews the result by default and writes a file only with the apply option.

Skill for Claude CodeCodex

Written for no agent in particular: nothing here depends on one. Also seen: reads .claude/ paths.

Good fit Use it to formalize an existing type system or create font tokens for a new interface.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/dragoon0x/dragoon-skills/typography
Install

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.

Any agent
npx skills add Dragoon0x/dragoon-skills --skill typography
Clone the repo
git clone --depth 1 https://github.com/Dragoon0x/dragoon-skills

Made for: Claude Code, Codex.

Wrote 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.

agentmods badge for typography

README.md
[![agentmods](https://agentmods.dev/badge/skills/dragoon0x/dragoon-skills/typography/github.svg)](https://agentmods.dev/skills/dragoon0x/dragoon-skills/typography)
Your own site
<a href="https://agentmods.dev/skills/dragoon0x/dragoon-skills/typography"><img src="https://agentmods.dev/badge/skills/dragoon0x/dragoon-skills/typography/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.

agentmods 80×15 button for typography

Your own site · 80×15
<a href="https://agentmods.dev/skills/dragoon0x/dragoon-skills/typography"><img src="https://agentmods.dev/badge/skills/dragoon0x/dragoon-skills/typography.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 116 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 385 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

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.

ModelPer sessionOnce invoked
Fable 5.1 $0.00116 $0.00385
Opus 5.5 $0.00046 $0.00154
Sonnet 5.5 $0.00023 $0.00077
Haiku 4.5 $0.00012 $0.00038

Measured 1mo ago against content hash e7b82c0e1121, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

typography 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.

The scan reads SKILL.md. This mod also ships 1 executable file (scripts/typography.js), listed below but not scanned — reading those needs a real analyzer, not pattern matching.

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.

skills/typography/SKILL.md · 34 lines

What it actually says

/typography

Generates a 9-step type scale (xs / sm / base / md / lg / xl / 2xl / 3xl / 4xl) anchored on 16px, using the ratio detected by /scan (or a sensible default if none was found).

When to use

  • The user wants to formalize their typography system
  • The user asks for a "type scale", "font tokens", or "type tokens"
  • After /scan detects a type ratio, to extract it as reusable tokens

Output

One file per run. Format chosen automatically from the stack, override with --format:

  • css → :root { --font-size-xs: ... }
  • tailwind → module.exports = { theme: { extend: { fontSize: { ... } } } }
  • js → export const fontSize = { xs: '...', ... }

Default dir: src/styles/. Override with --dir.

Run it

dragoon typography                           # preview
dragoon typography --apply                   # write
dragoon typography --format js --apply
dragoon typography --dir src/tokens --apply
Files

What ships with it

1 file 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.

Changes

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.

  1. 1mo ago First seen · 34 lines · 0 tokens per session scan A e7b82c0e1121

Subscribe to this mod's changes

typography is a skill published in the GitHub repository Dragoon0x/dragoon-skills (4 stars, last pushed 6mo ago), licensed MIT. It adds 116 tokens to every session and 385 once invoked, about $0.0005 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-31.

Related

Other skills, from other repositories

role-ui-ux-designer

Use when orchestrating UI/UX design systems, anti-AI-slop frontend styling, tactile micro-interactions, responsive design tokens, accessibility standards, and high-fidelity interface engineering.

oyi77/1ai-skills · 44 tokens

design-engineering

Premium design engineering skill for agentic workflows — produces high-end, distinctive UI designs using DESIGN.md as the portable contract across Pencil MCP (in-IDE canvas), Figma MCP (team handoff + design tokens), and Google Stitch (vibe exploration + AI generation). Enforces anti-generic principles, WCAG 2.2 AA…

broomva/skills · 231 tokens

design-md

Pick a design language from a categorized offline catalog of 153 entries (84 brands, 68 styles, 1 business scene), write it as DESIGN.md in the project root, then implement or restyle production UI from that file and verify it in a running page. Use when the user asks to list or compare design styles, build a page in…

bahayonghang/my-ai-cli-toolkit · 224 tokens

7onic-setup

Detect, configure, and verify a project for the 7onic Design System — framework/Tailwind detection, token CSS wiring, and an idempotent health check. Run after installing @7onic-ui packages, after npx 7onic init, or whenever styles look wrong.

itonys/7onic · 63 tokens

a11y-toolkit

Use for ALL accessibility work — WCAG 2.2 audits of URLs or HTML, real rendered contrast checks (including text over images, pixel-level), color-pair contrast and nearest passing color, European Accessibility Act / RD 1112/2018 accessibility statements, pre-deploy regression detection (accessible names, tab order)…

kinti/a11y-toolkit · 143 tokens

7onic-design

Build UI with the 7onic Design System the right way — guided workflow that drives the 7onic MCP tools (component discovery, token resolution, layout recipes, validatecode loop) from a plain-language request like "SaaS dashboard" or "pricing page". Queries work in English, Japanese, and Korean.

itonys/7onic · 68 tokens