ONE FAMILY. A COMMON RHYTHM.
A small shape.The right meaning. 1,877 Lucide icons, with a shared way to use them. Find a shape, adjust the details and copy it into your interface.
1,877 icons Inspect Camera All General Files Navigation Communication Commerce Development Interface Media Weather
A Arrow Down A Arrow Up A Large Small Accessibility Activity Ad Air Vent Airplay Alarm Clock Alarm Clock Check Alarm Clock Minus Alarm Clock Off Alarm Clock Plus Alarm Smoke Align Center Horizontal Align Center Vertical Align End Horizontal Align End Vertical Align Horizontal Distribute Center Align Horizontal Distribute End Align Horizontal Distribute Start Align Horizontal Justify Center Align Horizontal Justify End Align Horizontal Justify Start Align Horizontal Space Around Align Horizontal Space Between Align Start Horizontal Align Start Vertical Align Vertical Distribute Center Align Vertical Distribute End Align Vertical Distribute Start Align Vertical Justify Center Align Vertical Justify End Align Vertical Justify Start Align Vertical Space Around Align Vertical Space Between Ambulance Ampersand Ampersands Amphora Anchor Angle Antenna Anvil Aperture App Window App Window Mac Apple Archive Archive Restore Archive X Armchair Armenian Dram Arrow Big Down Arrow Big Down Dash Arrow Big Left Arrow Big Left Dash Arrow Big Right Arrow Big Right Dash Arrow Big Up Arrow Big Up Dash Arrow Down Arrow Down 0 1 Arrow Down 1 0 Arrow Down A Z Arrow Down From Line Arrow Down Left Arrow Down Narrow Wide Arrow Down Right Arrow Down To Dot Arrow Down To Line Arrow Down Up
Preview size 16px 18px 20px 24px 32px
Stroke width 1.5 1.75 2
Preview colour Ink Muted Accent
import { Camera } from 'lucide-react';
import { Icon, IconButton, Button } from '@bld8/ui';
<Icon icon={Camera} size={24} strokeWidth={1.75} />
<IconButton icon={Camera} label="Camera" />
<Button leadingIcon={Camera}>Continue</Button>Lucide 1.55.0 · ISC, with MIT notices for Feather-derived icons. Licence notices
USE WHAT YOU NEED
Keep the import clear. Import a named icon from Lucide and pass it to the BLD8 Icon component. Application bundles include their chosen icons; this directory uses generated SVG previews.
NOTES TO SELF
The label still matters. Icons beside text are decorative. Give icon-only controls a clear label. BLD8 defaults to an 18px size, a 1.75 stroke and the surrounding text colour.
Lucide documentation