Introduction
Iconiq is an open-source library of animated icons and motion UI components for React — built on Framer Motion, distributed via shadcn CLI.
What is Iconiq
Instead of shipping an icon package you update as a dependency, Iconiq gives you individual animated React components that live directly in your codebase. Each icon or UI component is added once via the shadcn CLI and is fully yours to edit.
Animations are authored with Framer Motion spring physics and respect prefers-reduced-motion. Icons follow the Lucide grid so they blend with any existing Lucide usage.
At a glance
- 385+
- Animated icons
- 16
- UI components
- 0
- Runtime deps
- shadcn
- CLI compatible
Distribution
Every icon and component is installed with one shadcn command — no package to update, no version conflicts.
npx shadcn@latest add @iconiq/bellDesign principles
Lucide-grid icons
Every icon follows the same stroke weight, corner radius, and optical sizing as Lucide — so they sit naturally beside each other and native UI.
UI components
Beyond icons, Iconiq ships a growing set of animated UI components — each built with Framer Motion spring physics and drop-in compatible with shadcn/ui.
Motion that means something
Animations are triggered by hover, focus, or state change. They reinforce what the icon represents — a bell rings, a download arrow falls.
Copy-paste, no lock-in
Everything lands directly in your source tree. No icon font, no CDN, no provider — just React and Framer Motion.
Built on
- Framer Motionspring animations
- Lucide gridicon geometry
- shadcn/uicomponent base
- Tailwind CSSstyling
Ready to start?
Run a single shadcn command to add any icon or component.