Icons

The unified icon system: one tokenized Icon wrapper over Lucide, a curated set of Motion-driven animated icons, and a searchable browser.

Icon

The unified wrapper over Lucide — one consistent size scale, stroke width, and tone (via currentColor + tokens) for every icon in every app. Tree-shakeable: it takes the icon component as a prop, so bundlers ship only the glyphs you use.

  • Icon
Size scale
xs · 12px
sm · 16px
md · 20px
lg · 24px
xl · 32px
Tone (currentColor + tokens)
current
muted
primary
destructive
foreground
Stroke width
1
1.5
2
2.5

Animated icons

A small, curated set of Motion-driven icons that preview on hover or bind to UI state — menu ⇄ close, copy → check, chevron, notification bell, and a spinner. Every one is reduced-motion-safe (still under prefers-reduced-motion) and SSR/prerender-safe.

  • AnimatedMenu
  • AnimatedCopy
  • AnimatedChevron
  • AnimatedBell
  • AnimatedSpinner
Reduced-motion safeSSR-safeBuilt on Motion
Hover to preview
AnimatedMenu
AnimatedCopy
AnimatedChevron
AnimatedBell
AnimatedSpinner
Wired to state

Icon browser

Search the curated Lucide catalog, filter by group, toggle size and stroke live, then click any icon to copy its JSX or name. The grid scrolls in its own container so a large result set never grows the page.

  • Icon
Size
Stroke
Copy

146 icons · click to copy the JSX