#animation CSS effects

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

Live preview Checkboxes

Ferry Toggle

A ferry floats in with blue glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Fire Ignite Toggle

A dim flame emoji that ignites with a flickering orange glow when toggled on.

#animation #shadow #transform

Live preview Checkboxes

Fire Truck Toggle

A fire truck shakes in red-orange when checked.

#animation #transform #shadow

Live preview Checkboxes

Fish Swim Toggle

A fish swims with a blue glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Fishing Toggle

A fishing rod shakes blue when checked.

#animation #transform #shadow

Live preview Checkboxes

Flag Wave Toggle

A flag waves red when checked.

#animation #transform #shadow

Live preview Checkboxes

Flamingo Toggle

A flamingo pulses pink when checked.

#animation #transform #shadow

Live preview Checkboxes

Flea Toggle

A flea pulses red when checked.

#animation #transform #shadow

Live preview Checkboxes

Flicker Toggle

A flicker spins red when checked.

#animation #transform #shadow

Live preview Checkboxes

Flycatcher Toggle

A flycatcher pulses green when checked.

#animation #transform #shadow

Live preview Checkboxes

Frog Jump Toggle

A frog jumps with a green glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Galaxy Spiral Toggle

A galaxy spirals with a violet glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Genmaicha Toggle

A genmaicha pulses green when checked.

#animation #transform #shadow

Live preview Checkboxes

Goldeneye Toggle

A goldeneye bounces yellow on check.

#animation #transform #shadow

Live preview Checkboxes

Goldfinch Toggle

A goldfinch shakes yellow when checked.

#animation #transform #shadow

Live preview Checkboxes

Golf Flag Toggle

A golf flag pulses green when checked.

#animation #transform #shadow

Live preview Checkboxes

Gooseberry Toggle

A gooseberry bounces green on check.

#animation #transform #shadow

Live preview Checkboxes

Goshawk Toggle

A goshawk spins gray when checked.

#animation #transform #shadow

Live preview Checkboxes

Animated Gradient Fill

A square filled with an animated gradient background and a white checkmark when checked.

#gradient #animation #border

Live preview Checkboxes

Green Grape Toggle

Green grapes bounce pop on check.

#animation #transform #shadow

Live preview Checkboxes

Red Grape Toggle

Red grapes shake when checked.

#animation #transform #shadow

Live preview Checkboxes

Grapefruit Toggle

A grapefruit spins pink when checked.

#animation #transform #shadow

Live preview Checkboxes

Grasshopper Leap Toggle

A grasshopper leaps with a green glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Grebe Toggle

A grebe pulses brown when checked.

#animation #transform #shadow

Live preview Checkboxes

Guitar Strum Toggle

A guitar glows amber when checked.

#animation #transform #shadow

Live preview Checkboxes

Gymnastics Toggle

A gymnast pulses purple when checked.

#animation #transform #shadow

Live preview Checkboxes

Hammer Hit Toggle

A hammer shakes gray when checked.

#animation #transform #shadow

Live preview Checkboxes

Heart Favorite Toggle

A heart icon that fills with a red gradient and pulses when favorited.

#animation #shadow #transform

Live preview Checkboxes

Helicopter Toggle

A helicopter spins in gray when checked.

#animation #transform #shadow

Live preview Checkboxes

Honey Drip Toggle

A honey jar glows amber when checked.

#animation #transform #shadow

Live preview Checkboxes

Horchata Toggle

A horchata shakes amber when checked.

#animation #transform #shadow

Live preview Checkboxes

Horsefly Toggle

A horsefly pulses brown when checked.

#animation #transform #shadow

Live preview Checkboxes

Hospital Toggle

A hospital pulses red cross when checked.

#animation #transform #shadow

Live preview Checkboxes

Hot Dog Toggle

A hot dog bounces with a ketchup glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Hourglass Time Toggle

An hourglass glows amber when checked.

#animation #transform #shadow

Live preview Checkboxes

Ibis Toggle

An ibis bounces pink on check.

#animation #transform #shadow

Live preview Checkboxes

Ink Splat Checkbox

A drop of ink bursts out of the box and settles into a filled square when ticked.

#animation #transform #border

Live preview Checkboxes

Irish Coffee Toggle

An irish coffee spins brown when checked.

#animation #transform #shadow

Live preview Checkboxes

Jackfruit Toggle

A jackfruit spins yellow when checked.

#animation #transform #shadow

Live preview Checkboxes

Jaeger Toggle

A jaeger shakes black when checked.

#animation #transform #shadow

Live preview Checkboxes

Japanese Beetle Toggle

A japanese beetle pulses green when checked.

#animation #transform #shadow

Live preview Checkboxes

Joystick Play Toggle

A joystick glows red when checked.

#animation #transform #shadow

Live preview Checkboxes

Junco Toggle

A junco spins gray when checked.

#animation #transform #shadow

Live preview Checkboxes

June Bug Toggle

A june bug spins green when checked.

#animation #transform #shadow

Live preview Checkboxes

Kangaroo Hop Toggle

A kangaroo hops with a tan glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Keyboard Type Toggle

A keyboard glows gray when checked.

#animation #transform #shadow

Live preview Checkboxes

Kite Bird Toggle

A kite pulses gray when checked.

#animation #transform #shadow

Live preview Checkboxes

Koala Sleep Toggle

A koala glows with a blue-gray hue when checked.

#animation #transform #shadow

Live preview Checkboxes

Lacrosse Toggle

A lacrosse stick bounces orange on check.

#animation #transform #shadow

Live preview Checkboxes

Lassi Toggle

A lassi bounces yellow on check.

#animation #transform #shadow

Live preview Checkboxes

Latte Toggle

A latte spins amber when checked.

#animation #transform #shadow

Live preview Checkboxes

Lemon Zest Toggle

A lemon shakes with a bright yellow glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Lemonade Toggle

A lemonade pulses yellow when checked.

#animation #transform #shadow

Live preview Checkboxes

Lime Toggle

A lime bounces green on check.

#animation #transform #shadow

Live preview Checkboxes

Liquid Drop Checkbox

A droplet falls from above, lands in the box and floods it with colour.

#animation #gradient #transform

Live preview Checkboxes

Locust Toggle

A locust pulses brown when checked.

#animation #transform #shadow

Live preview Checkboxes

Lollipop Swirl Toggle

A lollipop spins with a rainbow hue rotation when checked.

#animation #transform #shadow

Live preview Checkboxes

Love Eyes Reveal

A plain heart-eyes emoji reveals with a pulsing pink glow and scale when checked.

#animation #shadow #transform

Live preview Checkboxes

Magnet Attract Toggle

A magnet glows red when checked.

#animation #transform #shadow

Live preview Checkboxes

Magnet Snap Checkbox

The tick flies in from the side and snaps hard against the box wall.

#animation #transform #border

Live preview Checkboxes

Mango Toggle

A mango pulses orange when checked.

#animation #transform #shadow

Live preview Checkboxes

Mangosteen Toggle

A mangosteen pulses purple when checked.

#animation #transform #shadow

Live preview Checkboxes

Marathon Toggle

A marathon runner pulses red when checked.

#animation #transform #shadow

Live preview Checkboxes

Yerba Mate Toggle

A mate spins green when checked.

#animation #transform #shadow

Live preview Checkboxes

Medal Spin Reveal

A medal emoji spins 360 degrees on its Y-axis and shines when awarded.

#animation #3d #shadow

Live preview Checkboxes

Mercury Cratered Planet

A small gray cratered Mercury rotates into view when checked.

#animation #gradient #transform

Live preview Checkboxes

Merganser Toggle

A merganser bounces green on check.

#animation #transform #shadow

Live preview Checkboxes

Meteor Streak Toggle

A bright meteor streaks across the box when checked.

#animation #gradient #transform

Live preview Checkboxes

Mic Speak Toggle

A mic glows pink when checked.

#animation #transform #shadow

Live preview Checkboxes

Milkshake Toggle

A milkshake shakes pink when checked.

#animation #transform #shadow

Live preview Checkboxes

Mite Toggle

A mite spins red when checked.

#animation #transform #shadow

Live preview Checkboxes

Mockingbird Toggle

A mockingbird shakes gray when checked.

#animation #transform #shadow

Live preview Checkboxes

Mosquito Buzz Toggle

A mosquito shakes with a gray glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Moth Toggle

A moth bounces brown on check.

#animation #transform #shadow

Live preview Checkboxes

Mouse Squeak Toggle

A mouse squeaks with a gray glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Nebula Cloud Toggle

A soft swirling cloud of cosmic gas appears when checked.

#animation #gradient #transform

Live preview Checkboxes

Neon Tube Checkbox

A dead glass tube stutters twice and then settles into a steady neon glow.

#animation #shadow #border

Live preview Checkboxes

Night Sky Toggle

A night sky glows blue when checked.

#animation #transform #shadow

Live preview Checkboxes

Northern Lights Curtain

A curtain of green and violet light shimmers when checked.

#animation #gradient #transform

Live preview Checkboxes

Music Note Bounce

A music note emoji bounces in rhythm with a purple glow when checked.

#animation #shadow #transform

Live preview Checkboxes

Nuthatch Toggle

A nuthatch spins blue when checked.

#animation #transform #shadow

Live preview Checkboxes

Ocean Wave Toggle

An ocean wave glows blue when checked.

#animation #transform #shadow

Live preview Checkboxes

Octopus Ink Toggle

An octopus wiggles with a magenta glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Opal Multi-Color Toggle

A multi-colored opal shifts through iridescent hues when checked.

#animation #gradient #transform

Live preview Checkboxes

Oriole Toggle

An oriole pulses orange when checked.

#animation #transform #shadow

Live preview Checkboxes

Otter Float Toggle

An otter floats with a blue glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Owl Hoot Toggle

An owl glows with a moonlit hue when checked.

#animation #transform #shadow

Live preview Checkboxes

Palm Tropical Toggle

A palm tree sways green when checked.

#animation #transform #shadow

Live preview Checkboxes

Parrot Squawk Toggle

A parrot glows with a rainbow hue when checked.

#animation #transform #shadow

Live preview Checkboxes

Pen Sign Toggle

A pen glows blue when checked.

#animation #transform #shadow

Live preview Checkboxes

Pencil Write Toggle

A pencil wiggles yellow when checked.

#animation #transform #shadow

Live preview Checkboxes

Penguin Waddle Toggle

A penguin waddles with an icy glow when checked.

#animation #transform #shadow

Live preview Checkboxes

Pepper Spice Toggle

A hot pepper flames red when checked.

#animation #transform #shadow

Live preview Checkboxes

Phoebe Toggle

A phoebe bounces gray on check.

#animation #transform #shadow

Live preview Checkboxes

Phone Call Toggle

A phone shakes green when checked.

#animation #transform #shadow

Live preview Checkboxes

Pina Colada Toggle

A pina colada shakes yellow when checked.

#animation #transform #shadow

Popular tags