# Nodo Icons documentation

Nodo Icons is an icon set of 5,000 UI icons drawn on a 24×24 grid, in 10 styles. The **Linear** style is free under the MIT license; the other nine styles are **Nodo Icons Pro**, sold once with free updates forever.

## Install

| Package | What | License |
|---|---|---|
| `@nodo-icons/react` | 5,000 Linear icons as React components | MIT |
| `@nodo-icons/vue` | 5,000 Linear icons as Vue 3 components | MIT |
| `@nodo-icons/static` | Linear SVG, outlined SVG, SVG sprite, icon font, `icons.json` | MIT |
| `@nodo-icons/mcp` | MCP server and CLI for AI agents | MIT |
| `@nodo-icons/react-pro`, `@nodo-icons/vue-pro` | All 10 styles (Pro license) | Pro |

```bash
npm install @nodo-icons/react
```

## React

```jsx
import { HomeIcon, CreditCardIcon } from '@nodo-icons/react';

<HomeIcon size={24} />
<CreditCardIcon size={20} color="#0a84ff" strokeWidth={1.5} title="Card" />
```

Component names are the icon name in PascalCase plus `Icon` (`credit-card` → `CreditCardIcon`); names starting with a digit get an `Icon` prefix (`3d-glasses` → `Icon3dGlasses`). Props: `size` (default 24), `color` (default `currentColor`), `strokeWidth` (default 1.5), `title` (adds `role="img"`; without it the icon is `aria-hidden`). Other props go to the `<svg>`, so `className="size-4"` works.

## Vue

```vue
<script setup>
import { HomeIcon } from '@nodo-icons/vue';
</script>

<template><HomeIcon :size="20" color="#0a84ff" /></template>
```

## SVG, sprite and font

```html
<img src="https://nodoicons.com/svg/linear/home.svg" width="24" height="24" alt="" />
<svg width="24" height="24"><use href="sprite/linear.svg#nd-home"/></svg>
```

## Use with shadcn/ui

shadcn/ui projects use `lucide-react`. Switch the imports to Nodo; JSX stays the same:

```bash
npx @nodo-icons/mcp migrate-lucide ./src --dry
npx @nodo-icons/mcp migrate-lucide ./src
npm install @nodo-icons/react
```

All 166 icons used by shadcn/ui components have a Nodo equivalent.

## Use with AI agents (MCP)

```bash
claude mcp add nodo-icons -- npx -y @nodo-icons/mcp
```

Other MCP clients: `{ "mcpServers": { "nodo-icons": { "command": "npx", "args": ["-y", "@nodo-icons/mcp"] } } }`. Tools: `search_icons`, `get_icon` (SVG, React, Vue, sprite), `list_styles`, `list_categories`. With Pro, set `NODO_PRO_DIR` to the unzipped Pro download to get every style.

## Styles

| Style | Look | Tier |
|---|---|---|
| Linear | 1.5px outline, round caps | Free |
| Light | 1px outline | Pro |
| Bold | 2px outline | Pro |
| Sharp | Square corners, flat caps | Pro |
| Twotone | Outline, secondary details at 40% | Pro |
| Duotone | Outline plus 30% tonal fill | Pro |
| Bulk | 40% silhouette, crisp details | Pro |
| Solid | Filled, negative-space details | Pro |
| Contained | Glyph cut out of a rounded square | Pro |
| Soft | Glyph on a 12% tinted tile | Pro |

## Pricing and license

- Free: Linear style, MIT, no attribution required. [Free license](/license/free/)
- Pro: all 10 styles, every format, commercial and client work, free updates forever. $49 per 10 people during early access, then $99. [Pro license](/license/pro/)
- Enterprise: unlimited people, extended license for templates and UI kits, invoicing. $499.

## Machine-readable resources

- [/llms.txt](/llms.txt) and [/llms-full.txt](/llms-full.txt): summaries for language models

## Contact

- General: hello@nodoicons.com
- Support, refunds, license transfers: support@nodoicons.com
- Enterprise and invoicing: enterprise@nodoicons.com
- Legal notices: legal@nodoicons.com