Icons

Shadcn icons

Browse icon libraries for shadcn/ui projects. Search, preview, and copy production-ready icons. Keep your design system consistent across Figma and code.

About shadcn icons

This page lists curated icon libraries compatible with shadcn/ui workflows. It provides search, categorization, and usage guidance so teams can maintain visual consistency across components, templates, and design systems.

All five supported icon libraries—Lucide, Hugeicons, Phosphor, Remix Icon, and Tabler—are included in our shadcn/ui Figma kit, so your designs and code stay in sync.

Search icons

Find icons instantly across supported libraries.

  • Search by name (e.g., arrow-left, dashboard, settings)
  • Filter by library
  • Filter by category
  • Copy SVG or React component

Customize preview

Preview icons with consistent system rules before you ship.

  • Stroke width control
  • Size scale (16 / 20 / 24 / 32)
  • Color preview (foreground / muted / primary)
  • Dark mode check

Maintain a single visual standard across your entire product.

Why icon systems break in real projects

  • Teams mix Lucide + Heroicons randomly
  • Designers use different stroke weights
  • Icons scale inconsistently
  • No shared wrapper component
  • No documented selection rule

This page exists to prevent that.

Frequently asked questions

Level-up your workflow today

One-time payment
14 days refund policy