// pattern
Icon Search Policy
Always free libraries first; drawn SVG as fallback. The order — Lucide → Heroicons → Iconify → claude-drawn — and why paid AI logo generators don't earn their place.
The rule
When any project needs an icon or logo, follow this order:
- Lucide (lucide.dev, MIT) — clean stroke-based, the default for terminal / minimal aesthetics.
- Heroicons (heroicons.com, MIT) — Tailwind's set; heavier strokes.
- Iconify aggregator (
api.iconify.design) — searches across ~200 sets when 1–2 don't fit. Useful prefixes:tabler,mdi,ph(Phosphor),simple-icons(brand logos),octicon. - Fallback: Claude-drawn pixel-art SVG — only when no library icon matches the project's visual style. Match the project's existing pixel-art mark if one exists (dimensions, palette,
image-rendering: pixelated).
Never use paid AI logo generators (Looka, Brandmark, Tailor Brands, Hatchful). They produce generic SaaS marks that fight any thoughtful aesthetic and add a license entanglement for zero quality gain.
Why this is durable
- All four sources are free for commercial use, no attribution required (verify per-icon for
simple-icons/ brand marks where trademark still applies). - Inline SVG keeps the asset versioned with the code, theme-able via CSS (
currentColor), zero-dependency. - The aggregator URL pattern
https://api.iconify.design/{prefix}/{name}.svg?color=...&width=...is stable and predictable — it survives across projects.
Constraints
- Inline the SVG. No
<img src="https://cdn.icon-host/...">references. - Decorative icons get
aria-hidden="true"; meaning-bearing icons needaria-labelor adjacent text. - Don't use this for full brand-identity work (color systems, wordmarks, multi-mark sets) — that's a designer or a dedicated brand prompt.
The implementation
Lives as a Claude Code skill: ~/.claude/skills/find-icon/SKILL.md. Triggered by phrases like "find an icon for X", "I need a logo", "icon for {tool}", or /find-icon. The skill walks the four-step search and returns inline SVG ready to paste.