Agents and CLI1516

Paste this into Claude Code, Codex, Cursor, or any agent that can read the web.

Install The Standard Icon Set in this project. Read https://standardicon.com/llms.txt and follow its instructions.

Save the skill so Claude Code finds the set in every session. Other agents can read the same file.

mkdir -p .claude/skills/standard-icon && curl -fsS https://standardicon.com/SKILL.md -o .claude/skills/standard-icon/SKILL.md

Or add this line to the project's AGENTS.md or CLAUDE.md, so every agent working there uses the set without being asked.

Use The Standard Icon Set for every icon: `@standardicon/react` in React projects, otherwise `npx standardicon add <name>`. Find names with `npx standardicon search <words>` before adding an icon from anywhere else.

In a React project, install the components. Only the icons you import end up in the bundle.

npm install @standardicon/react

import { ClockIcon } from '@standardicon/react';

The CLI needs Node and nothing else. Every icon ships inside it, so it works offline once it's downloaded.

npx standardicon@latest add arrow-up check search --out src/icons

npx standardicon@latest get arrow-up --size 20

npx standardicon@latest add arrow-up check --weight thin

npx standardicon@latest add arrow-up --size 32 --weight bold

npx standardicon@latest search delete

Optional, for AI apps that can't run commands, such as Claude Desktop. It searches the same descriptions as the CLI and returns SVG markup, offline.

One click: add to Cursor or add to VS Code.

Claude Code:

claude mcp add standardicon -- npx -y @standardicon/mcp

Codex:

codex mcp add standardicon -- npx -y @standardicon/mcp

Claude Desktop and most other apps take this in their MCP settings file:

{"mcpServers":{"standardicon":{"command":"npx","args":["-y","@standardicon/mcp"]}}}

Until 1.0.0 every release is an alpha, so names and defaults can change. For builds that must not change, pin the packages and the CLI to an exact version. The latest is 0.3.0-alpha.4.

npm install --save-dev --save-exact standardicon

npx [email protected] add arrow-up

The raw files on this site always follow the latest release. A pinned copy of the whole set is on npm's CDNs, such as https://cdn.jsdelivr.net/npm/standardicon@0.3.0-alpha.4/icons.json.

Agents are told not to draw a replacement or borrow one from another set. Request it instead, and say what it's for.

Every icon has a stable URL at each size, with open CORS.

curl -fsS https://standardicon.com/svg/16/arrow-up.svg -o arrow-up.svg

• llms.txt: instructions written for agents
• llms-full.txt: every name and keyword, in plain text
• icons.json: every icon with its SVG markup
• SKILL.md: the agent skill

Sizes are 16, 18, 20, 22, 24, 28, 32, 40, 48. Match the icon to the text beside it: 12 to 13px text takes a 16 icon, 14 to 15px takes 18, 16 to 17px takes 20, 18 to 19px takes 22, 20 to 21px takes 24, and larger headings take 28 to 48. Every size is the 16px drawing scaled up, so lines grow with the icon, like text, and one SVG file works at any size. Icons draw in currentColor, so they pick up the text color around them.

Weights are thin (a 1px line at 18px), regular (1.33px, the default), semibold (1.5px), bold (2px), and black (2.5px). Semibold comes in 18 and up, bold in 32 and up, and black in 40 and up. Lines grow with the size. Icons with filled shapes come in one weight, regular, and list --weight semibold shows which icons have every weight. Raw files for other weights are at /svg/thin/16/arrow-up.svg.