Agent skill
better-icons
Use when working with icons in any project. Provides CLI for searching 200+ icon libraries (Iconify) and retrieving SVGs. Commands: `better-icons search <query>` to find icons, `better-icons get <id>` to get SVG. Also available as MCP server for AI agents.
Install this agent skill to your Project
npx add-skill https://github.com/mxyhi/ok-skills/tree/main/better-icons
SKILL.md
Better Icons
Search and retrieve icons from 200+ libraries via Iconify.
CLI
# Search icons
better-icons search <query> [--prefix <prefix>] [--limit <n>] [--json]
# Search and download all found icons as SVG files
better-icons search <query> -d [dir] [--color <color>] [--size <px>]
# Get icon SVG (outputs to stdout)
better-icons get <icon-id> [--color <color>] [--size <px>] [--json]
# Setup MCP server for AI agents
better-icons setup [-a cursor,claude-code] [-s global|project]
Examples
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
# Batch download all search results
better-icons search arrow -d # saves to ./icons/
better-icons search check -d ./my-icons # saves to ./my-icons/
better-icons search star -d -c '#000' -s 24 --limit 64
Icon ID Format
prefix:name - e.g., lucide:home, mdi:arrow-right, heroicons:check
Popular Collections
lucide, mdi, heroicons, tabler, ph, ri, solar, iconamoon
MCP Tools (for AI agents)
| Tool | Description |
|---|---|
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 |
TypeScript Interfaces
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
}
API
All icons from https://api.iconify.design
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
ai-elements
Build AI chat interfaces using ai-elements components — conversations, messages, tool displays, prompt inputs, and more. Use when the user wants to build a chatbot, AI assistant UI, or any AI-powered chat interface.
opensrc
Fetch dependency source code to give AI agents deeper implementation context. Use when the agent needs to understand how a library works internally, read source code for a package, fetch implementation details for a dependency, or explore how an npm/PyPI/crates.io package is built. Triggers include "fetch source for", "read the source of", "how does X work internally", "get the implementation of", "opensrc path", or any task requiring access to dependency source code beyond types and docs.
test-driven-development
Use when implementing any feature or bugfix, before writing implementation code
dogfood
Systematically explore and test a web application to find bugs, UX issues, and other problems. Use when asked to "dogfood", "QA", "exploratory test", "find issues", "bug hunt", "test this app/site/platform", or review the quality of a web application. Produces a structured report with full reproduction evidence -- step-by-step screenshots, repro videos, and detailed repro steps for every issue -- so findings can be handed directly to the responsible teams.
minimax-pdf
Use this skill when visual quality and design identity matter for a PDF. CREATE (generate from scratch): "make a PDF", "generate a report", "write a proposal", "create a resume", "beautiful PDF", "professional document", "cover page", "polished PDF", "client-ready document". FILL (complete form fields): "fill in the form", "fill out this PDF", "complete the form fields", "write values into PDF", "what fields does this PDF have". REFORMAT (apply design to an existing doc): "reformat this document", "apply our style", "convert this Markdown/text to PDF", "make this doc look good", "re-style this PDF". This skill uses a token-based design system: color, typography, and spacing are derived from the document type and flow through every page. The output is print-ready. Prefer this skill when appearance matters, not just when any PDF output is needed.
get-api-docs
Use this skill when you need documentation for a third-party library, SDK, or API before writing code that uses it — for example, "use the OpenAI API", "call the Stripe API", "use the Anthropic SDK", "query Pinecone", or any time the user asks you to write code against an external service and you need current API reference. Fetch the docs with chub before answering, rather than relying on training knowledge.
Didn't find tool you were looking for?