Fulldev uses the Icon component for interface icons, brand marks, and
content-owned icon names. It resolves Lucide icons first and falls back to
Simple Icons for brand marks.
---
import { Icon } from "@/components/ui/icon"
---
<Icon name="rocket" />
<Icon name="github" />Installation
Install the Fulldev icon component when you need icons:
npx shadcn@latest add @fulldev/iconRendering
Use the Icon component
Use Icon for both fixed UI icons and content-owned icon names. This keeps
Fulldev source consistent and avoids mixing static SVG imports with dynamic
icon resolution.
---
import { Icon } from "@/components/ui/icon"
---
<Icon name="heart" />
<Icon name="star" />
<Icon name="check" />
<Icon name="trash-2" />
<Icon name="message-circle" />
<Icon name="github" />Usage
Pass plain names to Icon:
<Icon name={feature.icon} /><Icon name="heart" />For brand icons:
<Icon name="github" />Notes
- Use Lucide icon names for interface icons.
- Use Simple Icons names for brand marks.
API Reference
See the GitHub source code for more information on props.