Blode Icons

4,193 icons for React in matched outline and filled pairs, with Lucide-compatible props

Import one icon by name, or load any of them on demand at runtime.

Demo

Search every icon by name or category and copy the import.

Install

npm install blode-icons-react

Quickstart

import { ChevronDownIcon } from "blode-icons-react";

export function Disclosure() {
  return <ChevronDownIcon size={20} strokeWidth={1.5} />;
}

Import paths

// The whole library, every name carrying an Icon suffix
import { ChevronDownIcon, SparkleIcon } from "blode-icons-react";
// Any icon by name, code-split and loaded on demand
import { DynamicIcon } from "blode-icons-react/dynamic";
// A single icon, for the tightest bundle
import ChevronDownIcon from "blode-icons-react/icons/chevron-down";

<DynamicIcon name="SearchIcon" size={24} />;

Props

Every icon forwards its ref and accepts any SVG attribute, plus these three.

Prop	Default	Description
size	24	Sets both width and height
color	currentColor	Passed to the SVG color attribute
strokeWidth	2	Outline thickness

Notes

• Common icons are also exported under their lucide-react names, so ChevronDown and Search resolve without the suffix.
• LucideProps and LucideIcon are exported, and match the lucide-react types of the same name.
• Every icon is generated from SVGO-optimised source, so nothing arrives with editor cruft in it.
• Part of Blode.

License

MIT

---

Crafted by Matthew Blode