skills.rest
wukangcheng2944
wukangcheng2944COMMUNITY
Explore all skills by this author →
GitHub

icon-finder

Search six Iconify libraries and deliver icons as SVG or components.

Updated Apr 11, 2026
Search Tags:#frontend#svg#ui-design#icon#iconify#iconography
One-click install
npx skills add https://github.com/wukangcheng2944/claude-skills --skill icon-finder
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: icon-finder
Source: https://github.com/wukangcheng2944/claude-skills/tree/main/icon-finder
Command: npx skills add https://github.com/wukangcheng2944/claude-skills --skill icon-finder

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Icons are essential UI assets, but designers and developers often struggle to quickly locate the right SVGs across multiple libraries and formats.

Core Features & Use Cases

  • Cross-library search: query six libraries via the Iconify API to find the best-fitting icon.
  • Flexible delivery: output raw SVG, React/Vue components, Iconify runtime, or CDN-linked SVGs.
  • Use cases: drop icons into dashboards, apps, or marketing pages, ensuring visual consistency across Lucide, Heroicons, Phosphor, Tabler, Remix Icon, and Bootstrap Icons.

Quick Start

Ask for an icon (e.g., "settings") and specify the preferred library or output format to get an immediate result.

Frequently Asked Questions about icon-finder

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I search for UI icons across multiple SVG libraries like Lucide and Heroicons?▼

You can search for UI icons across multiple SVG libraries by querying the Iconify API, which finds the best-fitting matches from Lucide, Heroicons, Phosphor, Tabler, Remix Icon, and Bootstrap Icons.

Can I get React or Vue components directly from an Iconify icon search?▼

Yes, Iconify icon search can output results as raw SVG, React components, Vue components, Iconify runtime code, or CDN-linked SVGs, allowing direct integration into your frontend UI design workflow.

What is the best way to find consistent SVG icons for a dashboard or status indicator?▼

The best way to find consistent SVG icons for dashboards, buttons, and status indicators is cross-library search via Iconify, ensuring visual consistency across six major libraries like Tabler and Phosphor.

Does this icon search tool support custom size and color parameters for SVG output?▼

Yes, the icon search supports optional size and color parameters, delivering customized SVG assets or component code tailored to specific UI design requirements across the six supported libraries.

How do I use Iconify runtime versus raw SVG when adding icons to a frontend project?▼

You can choose Iconify runtime for dynamic loading or raw SVG and CDN-linked SVGs for static embedding when adding icons to frontend projects, depending on your performance and build requirements.

Related Skills

Explore More Design & Creative Skills→
AIA-11-HN-MIBAIA-11-HN-MIB
1

remix-icon

Provide 3,100+ RemixIcon icons in line and fill variants for web and mobile UI.

Official
Intermediate
jiaiyanjiaiyan
8

n-gradient-text

Render gradient text with configurable size and type in Vue 3.

Community
Intermediate
ProfPowellProfPowell
1

icons

Standardize Lucide-based icons with a local <x-icon> component.

Community
Intermediate
pengelbrechtpengelbrecht
6

SVG Logo Designer

Generate scalable SVG logo concepts from descriptive briefs with layout variations.

Community
Intermediate