#animation CSS effects

3,495 free, pure-CSS effects match the "animation" tag. Each is copy-ready and needs no library or build step.

Live preview Loaders

Rolling Pin

Rolling pin spinning back and forth over dough.

#animation #gradient #transform

Live preview Loaders

Santa Sleigh Fly

Santa's sleigh flying across.

#animation #gradient #transform

Live preview Loaders

Satellite Dish

Satellite dish emitting signal waves.

#animation #gradient #transform

Live preview Loaders

Saxophone

Saxophone with keys pressing along its curved body.

#animation #gradient #transform

Live preview Loaders

Sextant

Sextant arc with swinging arm.

#animation #transform #border

Live preview Loaders

Spark Fly

Sparks flying upward.

#animation #transform #shadow

Live preview Loaders

Stepper Motor

Stepper motor stepping in increments.

#animation #gradient #transform

Live preview Loaders

Tomato Slice

Tomato slice with seed pattern.

#animation #gradient #transform

Live preview Navigation

Push Content Left Drawer Navbar

Left drawer pushes the main content rightward when opening.

#hover #animation #border

Live preview Navigation

Gradient Flow Navbar

Navbar with an animated gradient background flowing across links.

#hover #animation #gradient

Live preview Navigation

Split Line Gradient Flow Navbar

Nav links separated by animated gradient line dividers.

#hover #animation #gradient

Live preview Text

Ballet Grace

Graceful ballet pink on text.

#animation #gradient #transform

Live preview Text

Daffodil Trumpet

Yellow daffodil trumpet cup on text.

#animation #gradient #transform

Live preview Text

Glow Pulse Text

Soft pulsing glow ring around text that breathes in and out.

#animation #glow #shadow

Live preview Text

Music Note Bounce

Bouncing musical notes over text.

#animation #transform #shadow

Live preview Text

Neptune Blue

Deep blue ice giant Neptune.

#animation #gradient #shadow

Live preview Text

Pearl Shimmer

Iridescent pearl shimmer with soft pastel shifts.

#animation #gradient

Live preview Text

Rhythm Pulse

Steady rhythm pulse on text.

#animation #transform #shadow

Live preview Text

Rotate Spin

Text rotating 360 degrees continuously.

#animation #transform

Live preview Text

Rotate Y Yaw

Y-axis yaw rotation animation.

#animation #transform

Live preview Text

Shake Vertical Rattle

Vertical rattle shake motion.

#animation #transform

Live preview Text

Strawberry Red

Sweet red strawberry on text.

#animation #gradient #transform

Live preview Text

Sustain Ring

Long sustained ringing note on text.

#animation #shadow #filter

Live preview Text

Treble Tinkle

High treble tinkle on text.

#animation #transform #shadow

Live preview Tooltips

Pulse Throb

Tooltip that throbs with a gentle pulse animation on hover.

#hover #animation #transform

Live preview Tooltips

Shimmer Wave

Tooltip with a shimmering wave gradient sweeping across.

#hover #animation #gradient

Live preview Tooltips

Zig Zag

Tooltip that zigzags into view above the trigger.

#hover #animation #transform

Live preview Toggles

Butterfly / Cocoon

Cocoon bursts open into a fluttering butterfly.

#animation #gradient #transform

Live preview Toggles

Flap / Still

Flapping wing knob goes still on the amber track.

#animation #transform #shadow

Live preview Toggles

Jelly Wobble

Soft jelly knob wobbles with a bouncy spring animation.

#animation #gradient #transform

Live preview Toggles

Manual / Auto

Hand-crank knob shifts to a spinning gear for auto mode.

#animation #transform #shadow

Live preview Toggles

Plasma Bolt

Electric plasma bolt crackles between two posts when active.

#animation #gradient #transform

Live preview Badges

Legendary Badge

Legendary achievement badge with rainbow shimmer.

#animation #gradient #transform

Live preview Badges

Breaking News Badge

Breaking news badge with red pulsing dot.

#animation

Live preview Badges

Critical Alert Badge

Critical alert badge with pulsing red animation.

#animation #transform #shadow

Live preview Badges

Live Indicator Badge

Live broadcast indicator badge with red pulse.

#animation #transform

Live preview Badges

Blink Badge

Badge that blinks on and off.

#animation

Live preview Badges

Bounce In Badge

Badge that bounces in on render.

#animation #transform

Live preview Badges

Bounce Loop Badge

Badge that bounces continuously.

#animation #transform

Live preview Badges

Breathe Glow Badge

Badge with breathing glow effect.

#animation #transform #shadow

Live preview Badges

Breathing Badge

Badge that gently breathes with subtle scale.

#animation #transform

Live preview Badges

Confetti Burst Badge

Badge with colorful confetti burst animation.

#animation #transform

Live preview Badges

Electric Badge

Badge with electric pulse effect.

#animation #transform #shadow

Live preview Badges

Fill Bar Badge

Badge with animated bottom fill bar.

#animation #gradient

Live preview Badges

Fire Badge

Badge with hot flickering fire effect.

#animation #gradient #transform

Live preview Badges

Flicker Badge

Badge with candle-like flicker effect.

#animation #shadow #filter

Live preview Badges

3D Flip Badge

Badge that flips in 3D continuously.

#animation #transform

Live preview Badges

Float Badge

Badge that gently floats up and down.

#animation #transform

Live preview Badges

Gleam Badge

Badge with subtle gleam reflection.

#animation #gradient #transform

Live preview Badges

Glisten Badge

Badge with glistening sparkle dots animation.

#animation #gradient #shadow

Live preview Badges

Glitch Badge

Badge with cyberpunk glitch effect.

#animation #transform #shadow

Live preview Badges

Glow Pulse Badge

Badge with strong glowing pulse aura.

#animation #shadow

Live preview Badges

Gradient Shift Badge

Badge with continuously shifting gradient.

#animation #gradient

Live preview Badges

Heartbeat Badge

Badge that beats like a heart.

#animation #transform

Live preview Badges

Jello Badge

Badge with jello-like wobble animation.

#animation #transform

Live preview Badges

Marquee Text Badge

Wide badge with scrolling text marquee.

#animation #transform

Live preview Badges

Particle Badge

Badge with floating particle dots around it.

#animation #transform #shadow

Live preview Badges

Pendulum Badge

Badge that swings like a pendulum.

#animation #transform

Live preview Badges

Progress Bar Badge

Badge with indeterminate progress indicator.

#animation #gradient

Live preview Badges

Pulse Color Badge

Badge with color cycling through palette.

#animation

Live preview Badges

Double Ring Pulse Badge

Badge with two expanding ring pulses staggered.

#animation #transform #border

Live preview Badges

Pulse Glow Badge

Badge with pulsing glow halo around it.

#animation #shadow

Live preview Badges

Pulse Ring Badge

Badge with expanding ring pulses around it.

#animation #transform #border

Live preview Badges

Pulse Scale Badge

Badge that continuously scales up and down.

#animation #transform

Live preview Badges

Pulse Shadow Badge

Badge with pulsing colored shadow.

#animation #shadow

Live preview Badges

RGB Cycle Badge

Gamer-style RGB cycling badge.

#animation #transform #shadow

Live preview Badges

3D Rotate Badge

Badge that rotates in 3D continuously.

#animation #transform

Live preview Badges

Shake Badge

Badge that shakes side-to-side continuously.

#animation #transform

Live preview Badges

Shimmer Badge

Badge with continuous shimmer effect.

#animation #gradient

Live preview Badges

Shine Sweep Badge

Badge with diagonal light sweep across surface.

#animation #gradient #transform

Live preview Badges

Sparkle Badge

Badge with twinkling sparkle effect.

#animation #gradient #shadow

Live preview Badges

Spin Badge

Badge that spins around its center.

#animation #transform

Live preview Badges

Spring Pop Badge

Badge that springs into view with overshoot.

#animation #transform

Live preview Badges

Tilt Badge

Badge that tilts back and forth.

#animation #transform

Live preview Badges

Typewriter Badge

Badge with text appearing like a typewriter.

#animation #border

Live preview Badges

Typing Dots Badge

Badge with three typing indicator dots.

#animation #transform #border

Live preview Badges

Caret Typing Badge

Badge with blinking caret like terminal input.

#animation #border

Live preview Badges

Three Dots Loading Badge

Badge with three pulsing loading dots.

#animation #transform #border

Live preview Badges

Water Drop Badge

Badge with water drop ripple effect.

#animation #transform

Live preview Badges

Wave Badge

Badge with subtle wave shimmer effect.

#animation #gradient #transform

Live preview Badges

Wobble Badge

Badge that wobbles side to side.

#animation #transform

Live preview Badges

Arctic Aurora Badge

Aurora-borealis gradient badge with shifting green-violet haze.

#animation #gradient #shadow

Live preview Badges

Beta Dot Badge

Subtle beta badge with a small status dot indicator.

#animation #border

Live preview Badges

Coming Soon Dots Badge

Coming soon badge with animated loading dots.

#animation #transform #border

Live preview Badges

Cyber Scanline Badge

Dark CRT-style badge with animated horizontal scan lines.

#animation #gradient #border

Live preview Badges

Diamond Sparkle Badge

Diamond badge with cyan sparkle and frosted finish.

#animation #gradient #shadow

Live preview Badges

BG Fade FX Badge

Animated badge with cross-fading background colors.

#animation #gradient #shadow

Live preview Badges

BG Slide FX Badge

Animated badge with sliding gradient background.

#animation #gradient #shadow

Live preview Badges

Bob Soft FX Badge

Animated badge with gentle vertical bobbing motion.

#animation #gradient #transform

Live preview Badges

Boing FX Badge

Animated badge that bounces up and down like a spring.

#animation #gradient #transform

Live preview Badges

Border March FX Badge

Animated badge with marching dashed border animation.

#animation #gradient #shadow

Live preview Badges

Color Cycle FX Badge

Animated badge that cycles through hue rotations.

#animation #gradient #transform

Live preview Badges

Confetti Burst FX Badge

Animated badge with confetti-burst particle dots.

#animation #gradient #transform

Live preview Badges

CRT Flicker FX Badge

Animated badge with CRT-monitor flicker effect.

#animation #gradient #shadow

Live preview Badges

Dashed Flow FX Badge

Animated badge with flowing dashed border line.

#animation #gradient #shadow

Live preview Badges

Fill Bottom Up FX Badge

Animated badge with rising fill from bottom to top.

#animation #gradient #transform

Popular tags