vocabulary — Claude Code skill: what it does, how to install
A reverse dictionary for UI and product design that turns loose descriptions into exact terminology and resolves confusing near-synonyms.
npx skills add index-how/vocabulary --skill vocabulary -a claude-codeWhat vocabulary does
This skill acts as a reverse dictionary for user interface design based on index.how/to/articulate. When you only know how a visual pattern works, the agent checks terms-index.md across areas like typography, layout, motion, or accessibility to identify the proper term.
The canonical source of truth lives in vocabulary.md. Whenever the skill resolves a concept, it states the boundary against related near-synonyms, clarifying distinctions such as badge versus tag, tooltip versus popover, or kerning versus tracking. It also replaces vague phrasing in specs, PR descriptions, and commit messages with exact UI language.
If a concept has no matching entry in the vocabulary, the instructions forbid making up jargon. Keep in mind that definitions in the bundled dictionary use British spelling such as centre.
What it helps with
- find standard design terminology from a fuzzy concept description
- disambiguate confusing near-synonyms like badge versus tag or tooltip versus popover
- replace loose phrasing in specs, PRs, and commit messages with exact UI terms
- verify correct naming conventions across typography, layout, motion, and accessibility
Example prompts for the agent
- What is the term for the manual spacing adjustment between two specific letters?
- Should this UI element be called a badge or a tag?
- Review this spec text and replace vague UI descriptions with exact design terms
How to install vocabulary
1Skills CLI (Vercel)
npx skills add index-how/vocabulary --skill vocabulary -a claude-code2Manually: put the files in place
~/.claude/skills/vocabulary/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/vocabulary/
1Skills CLI (Vercel)
npx skills add index-how/vocabulary --skill vocabulary -a codex2Manually: put the files in place
.agents/skills/vocabulary/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add index-how/vocabulary --skill vocabulary -a cursor2Manually: put the files in place
.cursor/skills/vocabulary/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install index-how/vocabulary vocabulary2Manually: put the files in place
.github/skills/vocabulary/SKILL.md1Skills CLI (Vercel)
npx skills add index-how/vocabulary --skill vocabulary -a gemini-cli2Platform CLI
gemini skills install https://github.com/index-how/vocabulary --path skills/vocabularyManually: put the files in place
.devin/skills/vocabulary/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add index-how/vocabulary --skill vocabulary -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about vocabulary
How to install vocabulary in Claude Code?
Run npx skills add index-how/vocabulary --skill vocabulary -a claude-code.
What does the vocabulary skill do?
It provides reverse lookups for design terminology and clarifies subtle distinctions between confusable near-synonyms.
What is the primary source of truth for the definitions?
The skill relies on vocabulary.md. If the categorized summary in terms-index.md disagrees with it, the definition in vocabulary.md always takes precedence.
