1300+ Icons • 14 Motion Types

Icons that
come alive

A React icon library with beautiful hover animations. Powered by Motion. Accessible by default.

Why LivelyIcons

Built for modern React

Every icon is a fully typed React component with customizable size, stroke width, and animation behavior.

Smooth Motion

Powered by Motion for silky 60fps animations

Full Control

Component, context, or system-level animation control

Accessible

Respects prefers-reduced-motion automatically

TypeScript

Full type safety with excellent IDE support

example.tsx
import { Heart, Bell, Star } from 'lively-icons'

// 14 lively types × 4 trigger modes
<Heart lively="heartbeat" />
<Bell lively="ring" trigger="hover" />
<Star lively="wiggle" trigger="hover" />

// Trigger modes:
// hover (default), loop, mount, inView

// Lively types:
// scale, rotate, translate, shake, pulse
// bounce, draw, spin, ring, wiggle
// heartbeat, swing, float, none
Animation Types

14 distinct animation styles

Scale
Rotate
Translate
Shake
Pulse
Bounce
Draw
Spin
Ring
Wiggle
Heartbeat
Swing
Float
None

Start building with animated icons

1300+ beautifully crafted icons with 14 motion types, ready to bring life to your React applications.