BA

better-auth/better-icons

Developer tools

이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요. 원문 보기

1.4천 stars 62 forks 품질 74 트렌드 26MIT

아이콘 검색 및 가져오기를 위한 스킬 및 MCP 서버

개요

150+ 아이콘 컬렉션에서 200,000+ 아이콘을 검색 및 검색할 수 있습니다. AI 에이전트용 MCP 서버나 CLI 도구로 작동합니다. 에이전트 환경에서 더 나은 아이콘 CLI 기능을 활성화하세요(아래 모든 예시와 일치): 또는 CLI를 전역적으로 설치하여 직접 에이전트가 아닌 용도로 사용할 수도 있습니다: MCP 서버를 설정하여 AI 코딩 에이전트에서 아이콘 도구를 활성화하세요. 이 기능은 MCP 서버를 다음과 같은 방식으로 인터랙티브하게 구성합니다: - - - - - CLI를 사용해 터미널에서 직접 아이콘을 검색하고 가져오세요. 아이콘은 AI 지원 코딩에서 흔히 발생하는 문제점입니다. 모델들은 사용 가능한 아이콘이 무엇인지 파악하는 데 어려움을 겪고, 올바른 SVG 코드를 생성하며, 일관된 스타일을 유지하고, 아이콘을 제대로 정리하는 데 어려움을 겪습니다. 인라인 SVG는 불필요한 토큰도 소모합니다. - - 150+ 개의 아이콘 컬렉션(Lucide, Heroicons, Material Design 등) 검색 - - 사용한 아이콘 컬렉션을 기억하고 향후 검색에서 우선순위를 정합니다 - - 아이콘은 아이콘 파일(.tsx, .ts, .

개요(AI 번역)

150+ 아이콘 컬렉션에서 200,000+ 아이콘을 검색 및 검색할 수 있습니다. AI 에이전트용 MCP 서버나 CLI 도구로 작동합니다.

퀵 스타트

기술 추가

에이전트 환경에서 better-icons CLI 기능을 활성화하세요(아래 모든 예시와 일치):

직접 CLI 설치

또는 CLI를 전역적으로 설치하여 직접 에이전트가 아닌 용도로 사용할 수도 있습니다:


MCP 서버 (AI 에이전트)

MCP 서버를 설정하여 AI 코딩 에이전트에서 아이콘 도구를 활성화하세요.

이 기능은 MCP 서버를 다음과 같은 용도로 인터랙티브하게 구성합니다:

  • 커서
  • 클로드 코드
  • OpenCode
  • 윈드서핑
  • VS 코드 (부조종사)
  • 구글 안티비티

또는 수동으로 설정하세요.

CLI (직접 사용)

CLI를 사용해 터미널에서 직접 아이콘을 검색하고 가져오세요.

왜?

아이콘은 AI 지원 코딩에서 흔히 발생하는 문제점입니다. 모델들은 사용 가능한 아이콘이 무엇인지 파악하는 데 어려움을 겪고, 올바른 SVG 코드를 생성하며, 일관된 스타일을 유지하고, 아이콘을 제대로 정리하는 데 어려움을 겪습니다. 인라인 SVG는 불필요한 토큰도 소모합니다.

특징

  • 200,000+ 아이콘 - 150+ 아이콘 컬렉션(루시드, 히어로아이콘, 머티리얼 디자인 등) 전체 검색
  • 자동 학습 - 사용 중인 아이콘 컬렉션을 기억하고 향후 검색 시 우선순위를 정합니다

이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요.

README

원문 README의 일부입니다. 원문 보기.

Better Icons

Search and retrieve 200,000+ icons from 150+ icon collections. Works as an MCP server for AI agents or CLI tool.

Quick Start

Add Skills

Enable the better-icons CLI features in your agent environment (matches all examples below):

npx skills add better-auth/better-icons

Direct CLI Installation

Alternatively, install the CLI globally for direct non-agent use:

# Using npm
npm install -g better-icons

# Using Bun (faster)
bun add -g better-icons

MCP Server (AI Agents)

Configure the MCP server to enable icon tools in your AI coding agents.

npx better-icons setup

This interactively configures the MCP server for:

  • Cursor
  • Claude Code
  • OpenCode
  • Windsurf
  • VS Code (Copilot)
  • Google Antigravity

Or configure manually.

CLI (Direct Usage)

Use the CLI to search and retrieve icons directly from your terminal.

# 1. Search for icons (finds icons across 150+ collections)
npx better-icons search arrow --limit 10
npx better-icons search home --prefix lucide

# 2. Get icon SVG (outputs raw code or saves to file)
npx better-icons get lucide:home > icon.svg
npx better-icons get mdi:account --color '#333' --size 24

# 3. JSON output for scripting
npx better-icons search settings --json | jq '.icons[:5]'
npx better-icons get heroicons:check --json

Why?

Icons are a common pain point in AI-assisted coding. Models often struggle to know which icons are available, generate correct SVG code, maintain consistent styles, and organize icons properly. Inline SVGs also consume unnecessary tokens.

Features

  • 200,000+ Icons - Search across 150+ icon collections (Lucide, Heroicons, Material Design, etc.)
  • Auto-Learning - Remembers which icon collections you use and prioritizes them in future searches
  • Project Sync - Icons are written directly to your icons file (.tsx, .ts, .js) instead of pasting SVG into chat (saves tokens!)
  • Batch Retrieval - Get multiple icons at once
  • Similar Icons - Find the same icon across different collections and styles
  • Recent Icons - Quick access to icons you’ve used before
  • Multi-Framework - React, Vue, Svelte, Solid, and raw SVG exports

Manual Installation

Cursor

Add to ~/.cursor/mcp.json:

{
  "mcpServers": {
    "better-icons": {
      "command": "npx",
      "args": ["-y", "better-icons"]
    }
  }
}

Claude Code (CLI)

Add to ~/.claude/settings.json:

{
  "mcpServers": {
    "better-icons": {
      "command": "npx",
      "args": ["-y", "better-icons"]
    }
  }
}

Google Antigravity

Add to ~/.gemini/antigravity/mcp_config.json:

{
  "mcpServers": {
    "better-icons": {
      "command": "npx",
      "args": ["-y", "better-icons"]
    }
  }
}

MCP Tools

The following tools are available when using the MCP server with AI agents.

search_icons

GitHub에서 전체 README 보기

설치

npx -y better-icons
MCP 초보자라면? mcpskill.org 가이드부터 시작하세요 →

설정

{ "mcpServers": { "better-icons": { "command": "npx", "args": ["-y", "better-icons"] } } }