Blog

How to use and customize icons in shadcn/ui

A practical guide to using icons in shadcn/ui projects. Learn about Lucide icons, alternative icon libraries, customization options, and how to keep Figma and code in sync.

article·November 13, 2025·8 min read
How to use and customize icons in shadcn/ui
MW
Matt Wierzbicki

Founder @ shadcndesign.com

Continue reading

Related articles

View all articles
How to automate design-to-code with Figma and v0
article·5 min

How to automate design-to-code with Figma and v0

Design-to-code that works: turn structured Figma files into shadcn/ui, refine in v0. How strong systems make AI reliable.

Why AI in Figma Depends More on Structure Than Prompts
article·6 min

Why AI in Figma Depends More on Structure Than Prompts

AI in Figma works best when embedded in existing workflows and structure, not when generating from scratch. Learn why context, constraints, and routine work matter more than impressive demos.

5 Best Icon Libraries for React Projects Using shadcn/ui and Tailwind CSS
article·11 min

5 Best Icon Libraries for React Projects Using shadcn/ui and Tailwind CSS

Discover the best icon libraries for React projects using shadcn/ui and Tailwind CSS. Compare Lucide, HeroIcons, Material Symbols, Radix Icons, and Phosphor Icons to find the perfect fit for your design system.

Level-up your workflow today

One-time payment
14 days refund policy