Iconography
Metadata icon aligned to the text line
Inline sprite, currentColor, stable names. The active set is Lucide — stroke, 24px grid, 2px stroke, i-* names.
Hover a cell for the icon's name and its container box — every glyph ships in the same box, and optical balance happens inside it; never resize an icon to "fix" its visual weight. Click to copy the name.
i-check i-pipette i-x i-success i-warning i-error i-info i-help-circle i-chevron-down i-chevron-up i-chevron-right i-chevron-left i-chevrons-right i-chevrons-left i-arrow-right i-arrow-left i-arrow-up-down i-shuffle i-refresh-cw i-search i-filter i-eye i-eye-off i-message-square i-phone i-mail i-map-pin i-sparkles i-panel-left i-ellipsis i-ellipsis-vertical i-plus i-paperclip i-send i-square i-play i-pause i-skip-back i-rewind i-fast-forward i-skip-forward i-volume-2 i-volume-x i-repeat i-closed-caption i-columns i-smartphone i-tablet i-monitor i-maximize i-minimize i-picture-in-picture i-edit i-copy i-download i-upload i-file i-file-text i-image i-code i-trash i-lock i-key i-shield-check i-external-link i-link i-log-in i-log-out i-user i-settings i-sliders-horizontal i-bell i-calendar i-clock i-history i-thumbs-up i-thumbs-down i-heart i-home i-sun i-moon i-funnel i-clipboard-list i-package i-receipt i-wrench i-users i-chart-column i-archive i-building i-arrow-up i-arrow-down
Sizes
Example Token Value Usage
size.icon.xsGlyphs inside sm components: sm badges size.icon.smInline with text, dense UI size.icon.mdDefault actions, buttons size.icon.lgFeatures, empty states