Blode UI
GitHub

Icons

PreviousNext

Install and use blode-icons-react, a drop-in replacement for lucide-react.

Installation

npm install blode-icons-react

Usage

Import icons by name and use them as React components.

import { SearchIcon, PlusIcon } from "blode-icons-react";
 
<SearchIcon size={32} />
<PlusIcon color="red" strokeWidth={1.5} />

Lucide Compatibility

Drop-in replacement for lucide-react. Same names, same props.

// Lucide-compatible names (drop-in replacement)
import { ChevronDown, Search, Plus } from "blode-icons-react";
 
// Full library names (with Icon suffix)
import { ChevronDownIcon, SparkleIcon } from "blode-icons-react";

Props

All icons accept the same props as lucide-react.

PropTypeDefault
sizestring | number24
colorstringcurrentColor
strokeWidthstring | number2

Dynamic Imports

Load icons by name at runtime. Useful when the icon comes from a database or API.

import { DynamicIcon } from "blode-icons-react/dynamic";
 
<DynamicIcon name="SearchIcon" size={24} fallback={<span>Loading...</span>} />;

Resources