#transform CSS effects

5,986 free, pure-CSS effects match the "transform" tag. Each is copy-ready and needs no library or build step.

Live preview Hover

Hearts Burst

Hearts burst outward on hover.

#hover #animation #transform

Live preview Hover

Hearts Float

Tiny hearts float up on hover.

#hover #animation #transform

Live preview Hover

Hue Cycle

Element cycles through the full hue spectrum on hover.

#hover #animation #gradient

Live preview Hover

Hue Cycle Full

Continuously cycles hue through full 360° on hover.

#hover #animation #transform

Live preview Hover

Image Zoom Overlay

Image scales up gently while a dark overlay fades in with a caption.

#gradient #hover #border

Live preview Hover

Implode

Content shrinks toward a central point with a vortex glow on hover.

#gradient #hover #border

Live preview Hover

Invert Partial

Partial color inversion creates a surreal tone on hover.

#hover #transform #filter

Live preview Hover

Iris Close

Iris-shutter closes on hover.

#hover #gradient #transform

Live preview Hover

Iris Expand

Iris expands to reveal on hover.

#hover #gradient #transform

Live preview Hover

Iris Open

Circular iris opens to reveal new color on hover.

#hover #transform

Live preview Hover

Jelly Bounce

Jelly-like bounce on hover.

#hover #animation #transform

Live preview Hover

Jelly Wobble Fast

Fast jelly wobble on hover.

#hover #animation #transform

Live preview Hover

Jiggle Fast

Fast jiggle on hover.

#hover #animation #transform

Live preview Hover

Jiggle Slow

Slow jiggle on hover.

#hover #animation #transform

Live preview Hover

Jiggle Small

Element jiggles with tiny rapid movements on hover.

#hover #animation #transform

Live preview Hover

Key Light Studio

Studio key-light sweep on hover.

#hover #gradient #transform

Live preview Hover

Laser Line

Thin laser line crosses horizontally on hover.

#hover #transform #shadow

Live preview Hover

Leap Up

Element leaps upward on hover.

#hover #transform #shadow

Live preview Hover

Lift Card Shadow

Card lifts upward with a soft, diffuse shadow on hover.

#hover #shadow #border

Live preview Hover

Look Up

Element looks up on hover.

#hover #transform

Live preview Hover

Magenta Shift

Hue rotates to magenta on hover.

#hover #transform #filter

Live preview Hover

Horizontal Bars Reveal

Multiple horizontal bars slide in on hover.

#hover #transform

Live preview Hover

Vertical Bars Reveal

Multiple vertical bars slide in to reveal content on hover.

#hover #transform

Live preview Hover

Corners Collapse Mask

Four corners collapse inward on hover.

#hover #transform

Live preview Hover

Cross Wipe Mask

Two wipes cross to form an X on hover.

#hover #transform

Live preview Hover

Curtain Ripple Mask

Curtain ripples to reveal content on hover.

#hover #transform

Live preview Hover

Curtain Rise Fast Mask

Curtain rises quickly on hover.

#hover #transform

Live preview Hover

Side Curtain Mask

Curtain parts horizontally on hover.

#hover #transform

Live preview Hover

Fade Flip X Mask

Content flips X-fades in on hover.

#hover #transform

Live preview Hover

Fade Flip Y Mask

Content flips Y-fades in on hover.

#hover #transform

Live preview Hover

Fade Rotate Mask

Content rotates-fades in on hover.

#hover #transform

Live preview Hover

Fade Skew Mask

Content skews-fades in on hover.

#hover #transform

Live preview Hover

Fade Slide Down Mask

Fades in while sliding down on hover.

#hover #transform

Live preview Hover

Fade Slide Up Mask

Fades in while sliding up on hover.

#hover #transform

Live preview Hover

Fade Zoom Mask

Content zoom-fades in on hover.

#hover #transform

Live preview Hover

Jigsaw Assemble Mask

Jigsaw pieces assemble on hover.

#hover #transform

Live preview Hover

Mosaic Tile Mask

Mosaic tiles flip in on hover.

#hover #transform

Live preview Hover

Page Turn 3D Mask

Page-like 3D turn reveals on hover.

#hover #transform #3d

Live preview Hover

Puzzle Piece Mask

Puzzle pieces fit together on hover.

#hover #transform

Live preview Hover

Quad Four Mask

Four quadrants animate on hover.

#hover #transform

Live preview Hover

Rotate Blur In Mask

Rotates and blurs in on hover.

#hover #transform #filter

Live preview Hover

Scatter Gather Mask

Scattered pieces gather together on hover.

#hover #transform

Live preview Hover

Slide Rotate Mask

Slides and rotates to reveal on hover.

#hover #transform

Live preview Hover

Split Cross Mask

Element splits in four cross-sections on hover.

#hover #transform

Live preview Hover

Split Horizontal Mask

Element splits horizontally to reveal on hover.

#hover #transform

Live preview Hover

Split Vertical Mask

Element splits vertically to reveal on hover.

#hover #transform

Live preview Hover

Zigzag Trace Mask

Zigzag pattern traces across on hover.

#hover #gradient #transform

Live preview Hover

Zoom Blur In Mask

Zoom-blur reveals content on hover.

#hover #transform #filter

Live preview Hover

Melt Drip

Button melts downward with drooping corners and a falling drip on hover.

#gradient #hover #border

Live preview Hover

Melt Drip Down

Element melts and drips down on hover.

#hover #transform

Live preview Hover

Melt Wax

Melts like wax on hover.

#hover #transform

Live preview Hover

Morph Diamond

Morphs into diamond on hover.

#hover #transform

Live preview Hover

Morph Heart

Morphs into heart shape on hover.

#hover #transform

Live preview Hover

Morph Hexagon

Morphs into hexagon on hover.

#hover #transform

Live preview Hover

Morph Star

Morphs into star shape on hover.

#hover #transform

Live preview Hover

Motion Smear

Label smears horizontally with a directional blur as if caught mid-motion on hover.

#gradient #hover #border

Live preview Hover

Motion Streak

Motion streak trail follows on hover.

#hover #transform #shadow

Live preview Hover

Night Vision

Green phosphor night-vision tint on hover.

#hover #transform #shadow

Live preview Hover

Orange Shift

Hue rotates to orange on hover.

#hover #transform #filter

Live preview Hover

Orbit Revolve

Satellite revolves on hover.

#hover #animation #transform

Live preview Hover

Orbit Spin

Orbital spin on hover.

#hover #animation #transform

Live preview Hover

Origami Fold

Element folds like origami on hover.

#hover #gradient #transform

Live preview Hover

Oscillate Sine

Smooth sine-wave oscillation on hover.

#hover #animation #transform

Live preview Hover

Oscillate Square

Square-wave step oscillation on hover.

#hover #animation #transform

Live preview Hover

Oscillate Swing

Element oscillates back and forth on hover.

#hover #animation #transform

Live preview Hover

Oscillate Triangle

Triangle-wave linear oscillation on hover.

#hover #animation #transform

Live preview Hover

Paint Brush

Brush stroke paint on hover.

#hover #gradient #transform

Live preview Hover

Paint Roller

Paint roller coats on hover.

#hover #gradient #transform

Live preview Hover

Paint Stroke

Paint stroke brushes across on hover.

#hover #transform

Live preview Hover

Balloon Burst

Balloons burst on hover.

#hover #animation #transform

Live preview Hover

Balloon Rise

Balloon rises on hover.

#hover #animation #transform

Live preview Hover

Bonfire Blaze

Bonfire blaze lights up on hover.

#hover #animation #gradient

Live preview Hover

Bubble Pop

Bubbles pop on hover.

#hover #animation #gradient

Live preview Hover

Butterfly Flutter

Butterfly-like wings flutter on hover.

#hover #animation #transform

Live preview Hover

Comet Trail

Comet streaks across on hover.

#hover #animation #gradient

Live preview Hover

Crystal Spark

Crystal sparkles twinkle on hover.

#hover #animation #transform

Live preview Hover

Electric Arc

Electric arcs flicker on hover.

#hover #animation #gradient

Live preview Hover

Fairy Dust

Fairy dust sparkles trail on hover.

#hover #animation #gradient

Live preview Hover

Feather Drift

Feathers drift down on hover.

#hover #animation #gradient

Live preview Hover

Firecracker

Firecracker bursts on hover.

#hover #animation #transform

Live preview Hover

Fog Roll

Fog rolls in across the element on hover.

#hover #animation #gradient

Live preview Hover

Fountain Jet

Fountain jets upward on hover.

#hover #animation #transform

Live preview Hover

Galaxy Particles

Galaxy of stars swirls around on hover.

#hover #animation #gradient

Live preview Hover

Geyser Spray

Geyser sprays upward on hover.

#hover #animation #gradient

Live preview Hover

Leaves Fall

Leaves fall across on hover.

#hover #animation #transform

Live preview Hover

Light Rays

Light rays beam on hover.

#hover #animation #gradient

Live preview Hover

Meteor Shower

Multiple meteors streak down on hover.

#hover #animation #gradient

Live preview Hover

Northern Lights

Soft northern lights drift on hover.

#hover #animation #gradient

Live preview Hover

Particles Orbit

Particles orbit around on hover.

#hover #animation #transform

Live preview Hover

Fast Orbit Particles

Particles orbit rapidly around the element on hover.

#hover #animation #transform

Live preview Hover

Petals Bloom

Petals bloom outward on hover.

#hover #animation #transform

Live preview Hover

Rocket Launch

Rocket launches upward on hover.

#hover #animation #gradient

Live preview Hover

Smoke Trail

Smoke trail rises on hover.

#hover #animation #gradient

Live preview Hover

Spark Fountain

Sparks fountain upward on hover.

#hover #animation #transform

Live preview Hover

Spiral In Particles

Particles spiral inward toward the element on hover.

#hover #animation #transform

Live preview Hover

Fast Particle Swirl

Particles swirl rapidly around the element on hover.

#hover #animation #transform

Effects tagged #transform

Popular tags