How to use Lucide icons via a CDN

A simple way to use Lucide icons in situations where you can't use NPM.

Similar to my standardization on shadcn, I’m starting to lean on Lucide as my icon library of choice. Usage in React is really simple - you install the package, import whatever icon you want, and get an SVG that can be customized via sane props for size, color, etc (and you can pass CSS, too).

If you want to use it in other places, you’ll need to use lucide-static (documentation). I recently shipped icons in my nav on this website, and I was impressed with how easy it was to use. It’s just an img tag, with unpkg.io as the CDN. Here’s how I use it in my nav:

<img src="https://unpkg.com/lucide-static@latest/icons/house.svg" /> Home