#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 Buttons

Abalone Shell

Iridescent abalone shell with shifting hues.

#animation #gradient #transform

Live preview Backgrounds

Deep Abyss

Lightless ocean abyss glows faintly with bioluminescent specks.

#animation #gradient #transform

Live preview Backgrounds

De Stijl Mondrian

Mondrian-style primary color blocks with bold black lines.

#animation #gradient #filter

Live preview Hover

Orbit Spiral

Spiral inward orbit on hover.

#hover #animation #transform

Live preview Buttons

Aurora Borealis

Northern-lights button with shifting aurora hues.

#hover #animation #gradient

Live preview Loaders

Baguette Slice

Baguette being sliced.

#animation #gradient #shadow

Live preview Loaders

7 Segment Display

7-segment display counting.

#animation #shadow

Live preview Toggles

Active / Inactive

Pulsing green dot signals active vs a still grey one.

#animation #transform #shadow

Live preview Backgrounds

Aurora Curtain

Vertical bands of aurora light ripple like a hanging curtain.

#animation #gradient #transform

Live preview Hover

Quiver Hard

Hard intense quiver on hover.

#hover #animation #transform

Live preview Loaders

Wormhole Tunnel

Traveling through a wormhole tunnel.

#animation #gradient #transform

Live preview Navigation

Neon Active Drawer Navbar

Drawer with a pulsing neon active indicator on the active link.

#hover #animation #shadow

Live preview Backgrounds

Brown Noise

Warm brown noise drifting like deep ambient rumble.

#animation #gradient #filter

Live preview Hover

Blink Swap

Content blinks rapidly and swaps text on each blink cycle on hover.

#animation #hover #border

Live preview Text

Chess Knight

Chess knight piece on text.

#animation #transform #shadow

Live preview Badges

Ripple Badge

Badge with expanding ripple waves.

#animation #transform #border

Live preview Backgrounds

Abalone Nacre

Abalone shell nacre with shifting iridescent colors.

#animation #gradient #transform

Live preview Backgrounds

Cassette Rewind

Cassette reels spin rapidly in reverse as tape rewinds.

#animation #gradient #transform

Live preview Buttons

Ocean Tide

Waves rolling across a blue button face.

#animation #gradient #transform

Live preview Buttons

Violet Storm

Deep violet button with lightning flicker.

#animation #gradient #shadow

Live preview Checkboxes

Battery Charge Toggle

A battery glows green when checked.

#animation #transform #shadow

Live preview Loaders

Actuator

Linear actuator extending arm.

#animation #gradient

Live preview Loaders

Arcade Cabinet

Retro arcade cabinet screen flickering with neon glow.

#animation #gradient #shadow

Live preview Loaders

Billiards Cue

Pool cue striking ball.

#animation #gradient #transform

Live preview Badges

Soft Pulse FX Badge

Animated badge with gentle soft-pulse scale animation.

#animation #gradient #transform

Live preview Backgrounds

Cepheid Variable

A cepheid variable star pulses regularly in brightness.

#animation #gradient #transform

Live preview Backgrounds

Shifting Dunes

Golden desert dunes slowly shift and reshape with the wind.

#animation #gradient #transform

Live preview Backgrounds

Easter Eggs

Colorful painted Easter eggs scatter across spring grass.

#animation #gradient

Live preview Backgrounds

Annular Solar Eclipse

An annular eclipse shows a bright ring of fire around the moon.

#animation #gradient #transform

Live preview Backgrounds

Fluid Pour

Colorful fluid pours down in a steady thick stream.

#animation #gradient #transform

Live preview Backgrounds

Fractal Tree

Self-similar fractal tree with branching limbs growing recursively.

#animation #gradient #transform

Live preview Backgrounds

Kaleidoscope 6

A 6-fold kaleidoscope of bright symmetric patterns.

#animation #gradient #transform

Live preview Backgrounds

Lissajous Curve

Lissajous curve figure traced by harmonic oscillation.

#animation #gradient #transform

Live preview Backgrounds

Morning Glory

Vivid blue morning glory vines spiral upward opening to the sun.

#animation #gradient #transform

Live preview Backgrounds

Paint Mixing

Thick layers of paint fold and mix together in slow motion.

#animation #gradient #transform

Live preview Backgrounds

Paint Splash

Vivid paint splashes burst and drip across a white canvas.

#animation #gradient #transform

Live preview Backgrounds

Plasma Arc

An electric plasma arc crackles between two points.

#animation #gradient #transform

Live preview Backgrounds

Plasma Torch

A bright blue plasma jet emits a thin column of superheated gas.

#animation #gradient #transform

Live preview Backgrounds

Sand Blast

Fine sand streams horizontally in a desert wind blast.

#animation #gradient

Live preview Backgrounds

Snow Drift

Snowflakes drift and accumulate into soft curves on the ground.

#animation #gradient #transform

Live preview Backgrounds

Gentle Snowfall

Soft white snowflakes drift down across a winter night sky.

#gradient #animation #border

Live preview Backgrounds

Spacetime Warp

Spacetime itself warps and ripples around an invisible mass.

#animation #gradient #transform

Live preview Backgrounds

Static Noise

TV static noise grain at full intensity.

#animation #gradient

Live preview Backgrounds

Traffic Lights

Traffic lights cycle through red yellow and green.

#animation #gradient #transform

Live preview Backgrounds

Trophy Shine

A golden trophy spins with a sparkle highlight.

#animation #gradient #transform

Live preview Backgrounds

Wetland Marsh

Calm marsh water reflects reeds and a soft overcast sky.

#animation #gradient #transform

Live preview Buttons

Animated Stripe Button

Diagonal candy stripes that scroll continuously across the button.

#gradient #animation #hover

Live preview Buttons

Arc Welder Button

Industrial button with an electric arc tracing its top edge.

#hover #animation #transform

Live preview Buttons

Magenta Hot Pulse

Vivid magenta button with a throbbing pulse.

#hover #animation #transform

Live preview Buttons

Retro Terminal Button

Monospace terminal-style button with blinking cursor block.

#animation #hover #shadow

Live preview Buttons

Trailblazer

Bright orange trailblaze with motion lines.

#animation #gradient #transform

Live preview Cards

Promotion Card

Promotion card with an upward arrow, trophy, and gold confetti accents.

#animation #gradient #shadow

Live preview Checkboxes

Cosmic Ray Beam

A high-energy cosmic ray beam shoots through the box when checked.

#animation #gradient #transform

Live preview Checkboxes

Espresso Toggle

An espresso pulses brown when checked.

#animation #transform #shadow

Live preview Checkboxes

Falcon Toggle

A falcon shakes brown when checked.

#animation #transform #shadow

Live preview Checkboxes

Long Drum Toggle

A long drum shakes in orange when checked.

#animation #transform #shadow

Live preview Checkboxes

Scissors Cut Toggle

Scissors snip with a gray glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Silverfish Toggle

A silverfish spins gray when checked.

#animation #transform #shadow

Live preview Checkboxes

Sparkle Twinkle

A four-pointed sparkle that twinkles in with a magenta glow and slow spin when checked.

#animation #shadow #border

Live preview Checkboxes

Sun Brighten Toggle

A dim sun emoji brightens and slowly rotates with a warm yellow glow when checked.

#animation #shadow #transform

Live preview Checkboxes

Storm Crash Toggle

A thunderstorm shakes yellow when checked.

#animation #transform #shadow

Live preview Checkboxes

Pickup Truck Toggle

A pickup truck bounces in orange when checked.

#animation #transform #shadow

Live preview Checkboxes

Yellowjacket Toggle

A yellowjacket spins yellow when checked.

#animation #transform #shadow

Live preview Forms

Bounce Radio

Radio indicator bounces in with springy motion on selection.

#animation #transform #border

Live preview Forms

Success State Input

Input showing success state with green border and checkmark icon.

#animation #transform #shadow

Live preview Hover

Border Dash March

Dashed border marches around on hover.

#hover #animation #border

Live preview Hover

Color Shift BG

Background hue rotates continuously on hover.

#hover #animation #gradient

Live preview Hover

Embers Float

Floating embers drift up on hover.

#hover #animation #transform

Live preview Hover

Fire Spark

Fire sparks flicker on hover.

#hover #animation #gradient

Live preview Hover

Flip 3D Coin

Coin-toss flip on hover.

#hover #animation #gradient

Live preview Hover

Metallic Sheen Frame

Metallic gradient sheen sweeps the frame on hover.

#hover #animation #gradient

Live preview Hover

Jelly Wobble

Element wobbles like jelly on hover.

#hover #animation #transform

Live preview Hover

Rainbow Arcs

Rainbow arcs shimmer on hover.

#hover #animation #gradient

Live preview Hover

Rain Drops

Rain streaks fall on hover.

#hover #animation #gradient

Live preview Hover

Mega Shake

Violent mega shake on hover.

#hover #animation #transform

Live preview Hover

Horizontal Wobble

Horizontal wobble motion on hover.

#hover #animation #transform

Live preview Loaders

Asteroid Belt

Asteroids orbiting in a belt formation.

#animation #gradient #transform

Live preview Loaders

Banjo Strum

Banjo strings being strummed.

#animation #gradient #transform

Live preview Loaders

Black Hole

A swirling multicolor accretion disk being consumed by a dark core.

#gradient #animation #shadow

Live preview Loaders

Boxing Glove

Boxing glove jabbing back and forth like a punching bag.

#animation #gradient #transform

Live preview Loaders

Brownie Bite

Brownie with bite marks.

#animation #gradient #transform

Live preview Loaders

Brushless Motor

Brushless motor with smooth rotation.

#animation #transform

Live preview Loaders

Cannon Fire

Cannon with periodic fire burst.

#animation #gradient #transform

Live preview Loaders

Chess Knight

Chess knight piece moving.

#animation #gradient #transform

Live preview Loaders

Dart Throw Flight

Dart flying toward board.

#animation #gradient #transform

Live preview Loaders

Elevator

Elevator car rising and falling inside its shaft.

#animation #gradient #border

Live preview Loaders

Flute

Flute with finger keys pressing in a melody pattern.

#animation #gradient #transform

Live preview Loaders

Game Boy

Classic handheld Game Boy with a flickering screen.

#animation #gradient #transform

Live preview Loaders

Ice Cube Melt

Ice cube slowly melting into a puddle of water.

#animation #gradient #transform

Live preview Loaders

Joker Grin

Joker card with shifting grin.

#animation #gradient #transform

Live preview Loaders

Mandala Spin

Symmetric mandala pattern spinning.

#animation #transform

Live preview Loaders

Merry-Go-Round

Rotating platform with three colored horses spinning around.

#animation #gradient #transform

Live preview Loaders

Pearl Glow

Pearl with soft iridescent glow.

#animation #gradient #transform

Live preview Loaders

Pentagon Flower Spin

Five-petal flower spinning.

#animation #transform

Live preview Loaders

Pole Vault

Pole vaulter going over bar.

#animation #gradient #transform

Popular tags