Foundations
Iconography
Lucide is the system. 2px stroke, rounded caps and joins. We render at 16, 20, and 24px and never rasterize.
Sizes
16px
UI · default · alongside text
20px
Cards, list rows
24px
Section markers, empty states
Library sample
A starter set. Full Lucide library available.
home
search
settings
bell
user
check
x
plus
minus
arrow-right
chevron-down
calendar
file
map
camera
cloud
umbrella
shield
zap
clipboard
Usage
Do
Pair icons with labels in primary navigation. Use 16px alongside body text, 20px in lists, 24px for section markers.
Don't
Use icons alone for destructive actions or unfamiliar concepts — always include a tooltip or label.