Icon
A universal icon component supporting FontAwesome, Lucide, and Tabler icons with dynamic loading.
Font Awesome
Lucide
Tabler
Installation
Usage
import { Icon } from "@/components/Icon"
// Font Awesome (Default)
<Icon icon="thumbs-up" />
// Lucide
<Icon provider="lucide" icon="camera" />
// Tabler
<Icon provider="tabler" icon="user" />API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
icon | string | - | The name of the icon (e.g., "thumbs-up", "camera"). Alias for name. |
name | string | - | The name of the icon. |
provider | "fa" | "lucide" | "tabler" | "fa" | The icon library to use. |
variant | string | "fa-solid" | Font Awesome variant (e.g., "fa-brands"). |
size | string | number | - | Size of the icon. |
color | string | - | Color of the icon. |
stroke | string | number | - | Stroke width (Lucide/Tabler only). |