Back to Details

better-icons

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Better Icons

Better Icons

Search and retrieve icons from 200+ libraries via Iconify.
通过Iconify从200+个图标库中搜索和获取图标。

CLI

CLI

bash
undefined
bash
undefined

Search icons

搜索图标

better-icons search <query> [--prefix <prefix>] [--limit <n>] [--json]
better-icons search <query> [--prefix <prefix>] [--limit <n>] [--json]

Get icon SVG (outputs to stdout)

获取图标SVG（输出到标准输出）

better-icons get <icon-id> [--color <color>] [--size <px>] [--json]
better-icons get <icon-id> [--color <color>] [--size <px>] [--json]

Setup MCP server for AI agents

为AI Agent设置MCP服务器

better-icons setup [-a cursor,claude-code] [-s global|project]
undefined
better-icons setup [-a cursor,claude-code] [-s global|project]
undefined

Examples

示例

bash
better-icons search arrow --limit 10
better-icons search home --json | jq '.icons[0]'
better-icons get lucide:home > icon.svg
better-icons get mdi:home --color '#333' --json
bash
better-icons search arrow --limit 10
better-icons search home --json | jq '.icons[0]'
better-icons get lucide:home > icon.svg
better-icons get mdi:home --color '#333' --json

Icon ID Format

图标ID格式

prefix:name
- e.g., 
lucide:home
, 
mdi:arrow-right
, 
heroicons:check
prefix:name
- 例如：
lucide:home
, 
mdi:arrow-right
, 
heroicons:check

Popular Collections

热门图标库

lucide
, 
mdi
, 
heroicons
, 
tabler
, 
ph
, 
ri
, 
solar
, 
iconamoon
lucide
, 
mdi
, 
heroicons
, 
tabler
, 
ph
, 
ri
, 
solar
, 
iconamoon

MCP Tools (for AI agents)

MCP工具（适用于AI Agent）

ToolDescription
search_icons
Search across all libraries
get_icon
Get single icon SVG
get_icons
Batch retrieve multiple icons
list_collections
Browse available icon sets
recommend_icons
Smart recommendations for use cases
find_similar_icons
Find variations across collections
sync_icon
Add icon to project file
scan_project_icons
List icons in project
工具描述
search_icons
跨所有图标库搜索
get_icon
获取单个图标SVG
get_icons
批量获取多个图标
list_collections
浏览可用图标集
recommend_icons
根据使用场景提供智能推荐
find_similar_icons
跨图标库查找相似图标
sync_icon
将图标添加到项目文件
scan_project_icons
列出项目中的图标

TypeScript Interfaces

TypeScript 接口

typescript
interface SearchIcons {
  query: string
  limit?: number        // 1-999, default 32
  prefix?: string       // e.g., 'mdi', 'lucide'
  category?: string     // e.g., 'General', 'Emoji'
}

interface GetIcon {
  icon_id: string       // 'prefix:name' format
  color?: string        // e.g., '#ff0000', 'currentColor'
  size?: number         // pixels
}

interface GetIcons {
  icon_ids: string[]    // max 20
  color?: string
  size?: number
}

interface RecommendIcons {
  use_case: string      // e.g., 'navigation menu'
  style?: 'solid' | 'outline' | 'any'
  limit?: number        // default 10
}

interface SyncIcon {
  icons_file: string    // absolute path
  framework: 'react' | 'vue' | 'svelte' | 'solid' | 'svg'
  icon_id: string
  component_name?: string
}
typescript
interface SearchIcons {
  query: string
  limit?: number        // 1-999，默认值32
  prefix?: string       // 例如：'mdi', 'lucide'
  category?: string     // 例如：'General', 'Emoji'
}

interface GetIcon {
  icon_id: string       // 'prefix:name' 格式
  color?: string        // 例如：'#ff0000', 'currentColor'
  size?: number         // 像素
}

interface GetIcons {
  icon_ids: string[]    // 最多20个
  color?: string
  size?: number
}

interface RecommendIcons {
  use_case: string      // 例如：'navigation menu'
  style?: 'solid' | 'outline' | 'any'
  limit?: number        // 默认值10
}

interface SyncIcon {
  icons_file: string    // 绝对路径
  framework: 'react' | 'vue' | 'svelte' | 'solid' | 'svg'
  icon_id: string
  component_name?: string
}

API

API

All icons from 
https://api.iconify.design
所有图标来自 
https://api.iconify.design