Unicon

Just the icons you need. Zero bloat.

Browse 20,000+ icons and copy exactly what you need. Like shadcn/ui, but for icons.

Try it now at unicon.sh

Why Unicon?

Most icon libraries force you to install thousands of icons just to use a handful. Unicon lets you browse everything in one place and copy only what you need.

• Browse once, use anywhere — Search 9 icon libraries
• Copy exactly what you need — React, SVG, or JSON
• Bundle multiple icons — Export a set at once
• Zero dependencies — Paste directly into your project

Icon Libraries

Coming Soon

How to Use

1. Search for icons

Use natural language — search "happy face" to find smile icons, or "business" for briefcases and charts.

2. Copy what you need

Click any icon and choose your format:

React Component — Drop directly into your project:

export const ArrowRight = (props) => (
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" {...props}>
    <path d="M13.22 19.03a.75.75 0 0 1 0-1.06L18.19 13H3.75a.75.75 0 0 1 0-1.5h14.44l-4.97-4.97a.75.75 0 0 1 1.06-1.06l6.25 6.25a.75.75 0 0 1 0 1.06l-6.25 6.25a.75.75 0 0 1-1.06 0Z"/>
  </svg>
)

Raw SVG — For HTML, design tools, or anywhere else:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
  <path d="M13.22 19.03..."/>
</svg>

3. Bundle multiple icons

Select multiple icons and export as:

• Single file with all React components
• Individual SVG files
• JSON metadata

4. Open in v0

Send icons to v0.dev to prototype UI components.

CLI

Install icons directly from your terminal.

Installation

npm install -g @webrenew/unicon

# Or use npx (no install)
npx @webrenew/unicon search arrow

Quick Start

# Search for icons
unicon search "dashboard"

# Get icon as React component
unicon get home

# Copy to clipboard (macOS)
unicon get home | pbcopy

# Save to file
unicon get settings -o ./Settings.tsx

# Bundle icons by category
unicon bundle --category Dashboards

# Preview in terminal
unicon preview star

Output Formats

Config-Driven Workflow

For larger projects, use a config file:

unicon init
unicon add dashboard --category Dashboards
unicon add nav --query "arrow chevron"
unicon sync

See CLI.md for full documentation.

AI Integration

Unicon works with AI coding assistants.

Skills for AI Assistants

Install rules that teach AI assistants to use Unicon:

unicon skill --ide claude
unicon skill --ide cursor
unicon skill --all

Supported: Claude Code, Cursor, Windsurf, Agent, Antigravity, OpenCode, Codex, Aider

Then ask your AI:

• "Add a home icon to my project"
• "Search for dashboard icons"

MCP Server

For deeper integration, use the MCP server.

Claude Desktop / Cursor:

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

Cloud IDEs (v0, Bolt, Lovable):

https://unicon.sh/api/mcp

Tools: search_icons, get_icon, get_multiple_icons, get_starter_pack

See MCP docs for details.

Self-Hosting

Want to run your own instance? See DEVELOPMENT.md for setup instructions.

Build Notes

• The app build uses webpack (next build --webpack) for deterministic CI/local builds in restricted environments.
• The home route (/) is intentionally dynamic to avoid build-time database fetches during prerender.

License

MIT License — see LICENSE for details.

Icons retain their original licenses. See THIRD_PARTY_LICENSES.md for full attribution.

• MIT: Lucide, Phosphor, Huge Icons, Heroicons, Tabler, Feather, Iconoir, Devicons, Octicons
• Apache-2.0: Remix Icon, Carbon, Blueprint
• CC0: Simple Icons, Cryptocurrency Icons (logos are trademarks of their owners)

Built by WebRenew

unicon.sh · Issues