#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

Torch Flame

Torch flame blazes on hover.

#hover #animation #gradient

Live preview Hover

Tornado Particles

Tornado-like swirling particles on hover.

#hover #animation #gradient

Live preview Hover

Volcano Erupt

Volcano erupts with lava on hover.

#hover #animation #transform

Live preview Hover

Vortex Particles

Vortex of particles spins around the element on hover.

#hover #animation #gradient

Live preview Hover

Wave Crest

Wave crests roll on hover.

#hover #animation #gradient

Live preview Hover

Wind Blow

Wind-like motion lines blow across on hover.

#hover #animation #gradient

Live preview Hover

Peek Over

Element peeks over from above on hover.

#hover #transform

Live preview Hover

Peek Under

Element peeks from below on hover.

#hover #transform

Live preview Hover

Pendulum Fast

Fast pendulum swing on hover.

#hover #animation #transform

Live preview Hover

Perspective Tilt

Element tilts with strong perspective on hover.

#hover #transform

Live preview Hover

Petals Drift

Sakura petals drift on hover.

#hover #animation #transform

Live preview Hover

Petals Fall

Cherry petals drift down on hover.

#hover #animation #gradient

Live preview Hover

Petals Swirl

Petals swirl around on hover.

#hover #animation #transform

Live preview Hover

Pinch Middle

Middle pinches inward on hover.

#hover #transform

Live preview Hover

Pink Shift

Hue rotates to pink on hover.

#hover #transform #filter

Live preview Hover

Polaroid Tint

Warm polaroid instant-film tint on hover.

#hover #transform #filter

Live preview Hover

Pop In

Element pops inward on hover.

#hover #transform

Live preview Hover

Pop Out

Element pops outward on hover.

#hover #transform

Live preview Hover

Pulse Throb

Throbbing pulse on hover.

#hover #animation #transform

Live preview Hover

Purple Haze

Dreamy purple haze drifts over on hover.

#hover #gradient #transform

Live preview Hover

Purple Shift

Hue rotates to purple on hover.

#hover #transform #filter

Live preview Hover

Push Reveal

Top label pushes up and out, pulling a second label up from below on hover.

#hover #border #transform

Live preview Hover

Quiver Soft

Soft nervous quiver on hover.

#hover #animation #transform

Live preview Hover

Rain Splash

Rain splash droplets on hover.

#hover #animation #transform

Live preview Hover

Ray Burst

Light rays burst outward from center on hover.

#hover #animation #gradient

Live preview Hover

Red Shift

Hue rotates to red on hover.

#hover #transform #filter

Live preview Hover

Reflection Mirror

Mirror reflection beneath on hover.

#hover #gradient #transform

Live preview Hover

Reflection Water

Wavy water reflection on hover.

#hover #animation #gradient

Live preview Hover

Refraction Lens

Lens refraction magnifies on hover.

#hover #transform #filter

Live preview Hover

Refraction Prism

Prism splits light on hover.

#hover #gradient #transform

Live preview Hover

Ripple Pulse

An expanding ring ripples outward from the button on hover.

#gradient #hover #border

Live preview Hover

Rock Chair

Element rocks like a rocking chair on hover.

#hover #animation #transform

Live preview Hover

Rock Hard

Hard aggressive rocking on hover.

#hover #animation #transform

Live preview Hover

Rock Soft

Soft rocking motion on hover.

#hover #animation #transform

Live preview Hover

Roll Back

Element rolls backward on hover.

#hover #transform

Live preview Hover

Rotate 3D Book

Book-opening flip on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Box

Box lid flip open on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Card

Playing card 3D flip on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Combo

Combined X+Y+Z rotation on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Cube

Cube-face rotation on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Door

Door-swing rotation on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Envelope

Envelope flap fold on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Fold

Fold-over 3D on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Origami

Origami fold on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Page

Page-turn 3D flip on hover.

#hover #transform #border

Live preview Hover

Rotate 3D Panel

Panel swing on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Paper Boat

Paper boat rocking on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Paper Plane

Paper-plane banking on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Roll

Continuous 3D roll on hover.

#hover #animation #transform

Live preview Hover

Rotate 3D Shutter

Camera shutter flip on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Spin

Diagonal 3D spin on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Tilt

Smooth 3D tilt on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Tumble

Tumbling multi-axis rotation on hover.

#hover #animation #transform

Live preview Hover

Rotate 3D Twist

Twisted 3D rotation on hover.

#hover #transform #3d

Live preview Hover

Rotate 3D Window

Window-shutter flip on hover.

#hover #transform #3d

Live preview Hover

Rotate Full Spin

Element does a full 360 spin on hover.

#hover #transform

Live preview Hover

3D Rotate Wobble

3D rotation with wobble on hover.

#hover #animation #transform

Live preview Hover

Rotate X Full

Full 360° rotation on X-axis on hover.

#hover #animation #transform

Live preview Hover

Rotate X Half

Half 180° rotation on X-axis on hover.

#hover #transform #3d

Live preview Hover

Rotate Y Full

Full 360° rotation on Y-axis on hover.

#hover #animation #transform

Live preview Hover

Rotate Y Half

Half 180° Y-axis rotation on hover.

#hover #transform #3d

Live preview Hover

Rotate Z Full

Full 360° Z-axis spin on hover.

#hover #animation #transform

Live preview Hover

Rotate Z Half

Half 180° Z-axis rotation on hover.

#hover #transform

Live preview Hover

Rotate Z Spin

Element rotates 180 degrees on Z axis on hover.

#hover #transform

Live preview Hover

Rubber Band

Element wobbles like a rubber band on hover.

#hover #animation #transform

Live preview Hover

Rubber Snap

Rubber-band snap transform on hover.

#hover #animation #transform

Live preview Hover

Scale Grow

Element scales up uniformly on hover.

#hover #transform

Live preview Hover

3D Scale Pulse

3D pulsing scale on hover.

#hover #animation #transform

Live preview Hover

Scale Shrink

Element shrinks down on hover.

#hover #transform

Live preview Hover

Seesaw Gentle

Gentle seesaw tilt on hover.

#hover #animation #transform

Live preview Hover

Seesaw Tilt

Element tilts like a seesaw on hover.

#hover #animation #transform

Live preview Hover

Seesaw Violent

Violent seesaw motion on hover.

#hover #animation #transform

Live preview Hover

Shadow 3D Deep

Deep 3D extruded shadow on hover.

#hover #transform #shadow

Live preview Hover

Shadow Angled

Sharp angled offset shadow on hover.

#hover #transform #shadow

Live preview Hover

Shadow Colored

Vibrant colored shadow on hover.

#hover #transform #shadow

Live preview Hover

Shadow Extend

Drop shadow stretches long and offset on hover.

#hover #transform #shadow

Live preview Hover

Shadow Hard Edge

Crisp hard-edged shadow on hover.

#hover #transform #shadow

Live preview Hover

Shadow Layered

Stacked layered shadows on hover.

#hover #transform #shadow

Live preview Hover

Shadow Long Tail

Long tail shadow streams on hover.

#hover #transform #shadow

Live preview Hover

Shadow Perspective

Perspective floor shadow on hover.

#hover #gradient #transform

Live preview Hover

Shadow Short Pop

Short tight shadow pop on hover.

#hover #transform #shadow

Live preview Hover

Shadow Soft

Soft diffuse shadow on hover.

#hover #transform #shadow

Live preview Hover

Shake Diagonal

Diagonal shake on hover.

#hover #animation #transform

Live preview Hover

Shake Horizontal

Horizontal shake on hover.

#hover #animation #transform

Live preview Hover

Mini Shake

Subtle small shake on hover.

#hover #animation #transform

Live preview Hover

Shake Random

Random multi-axis shake on hover.

#hover #animation #transform

Live preview Hover

Shake Side

Element shakes horizontally on hover.

#hover #animation #transform

Live preview Hover

Shake Subtle

Subtle micro-shake on hover.

#hover #animation #transform

Live preview Hover

Shake Vertical

Vertical shake on hover.

#hover #animation #transform

Live preview Hover

Shake Violent

Violent intense shake on hover.

#hover #animation #transform

Live preview Hover

Shatter Glass

Shatters into glass shards on hover.

#hover #gradient #transform

Live preview Hover

Shine Line Sweep

A bright shine band sweeps diagonally across the icon button.

#gradient #hover #border

Live preview Hover

Shine Swipe Panel

A narrow highlight sweeps diagonally across the panel exactly once per hover.

#hover #gradient #transform

Live preview Hover

Shiver Frost

Frosty shiver on hover.

#hover #animation #transform

Live preview Hover

Shrink Fade

Element shrinks and fades on hover.

#hover #transform

Effects tagged #transform

Popular tags