Icons that feel alive
Simple, minimal icons that each move the way the real thing would. Line, Liquid Glass and Fluent 3D, all as tiny web components.
Click to play · move your cursor to turn it
The collection
No icons match that search.
Three lines to get started
A typed React component for every icon, or plain HTML elements with no build step.
-
1
Install
npm i interactive-icons -
2
Import an icon
import { HeartFluent } from 'interactive-icons/react'; -
3
Use it anywhere
<HeartFluent size={48} href="/likes" label="Likes" />
-
Native interactions
Pins drop, bells ring, hearts pop. Every icon has its own motion.
-
Zero dependencies
Line and clay icons are plain web components. Glass and Fluent add three.js, only if you use them.
-
Accessible
Respects reduced motion, labels and
aria-pressed. -
Any framework
Works in HTML, React, Vue, Svelte and anything else.