Hover Effects — 850 CSS effects

Lift Card Shadow

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

#hover #shadow #border

#hover #animation #shadow

Lightning Flash

Lightning flash on hover.

Liquid Fill

Liquid fills up from bottom on hover.

Look Up

Element looks up on hover.

Magenta Burst

Magenta color bursts outward on hover.

#hover #shadow

Magenta Shift

Hue rotates to magenta on hover.

Magnetic Button

Button translates toward the cursor for a magnetic pull feel.

#gradient #hover #shadow

Horizontal Bars Reveal

Multiple horizontal bars slide in on hover.

Vertical Bars Reveal

Multiple vertical bars slide in to reveal content on hover.

3D Blinds Mask

Blinds fold in 3D on hover.

#hover #transform #3d

Center Out Mask

Mask expands from center outward on hover.

Checker Emerge Mask

Checkerboard pattern emerges on hover.

Circle Clip Grow

Circle clip-path grows to reveal on hover.

Circle Clip Shrink

Circle clip-path shrinks to reveal original on hover.

Diamond Clip

Diamond-shaped clip-path reveals on hover.

Hexagon Clip

Hexagon clip-path reveals on hover.

Octagon Clip

Octagon clip-path reveals on hover.

Pentagon Clip

Pentagon clip-path reveals on hover.

Triangle Clip

Triangle clip-path reveals on hover.

Clock Wipe Mask

Clock-hand wipe reveals from center on hover.

Conic Spin Grow

Conic gradient mask spins and grows on hover.

Corners Collapse Mask

Four corners collapse inward on hover.

Counter Clockwise Wipe

Counter-clockwise wipe reveals on hover.

Cross Wipe Mask

Two wipes cross to form an X on hover.

Cube 3D Spin Mask

Cube face rotates to reveal new content on hover.

#hover #transform #3d

Curtain Fall Fast Mask

Curtain falls quickly on hover.

Curtain Ripple Mask

Curtain ripples to reveal content on hover.

Curtain Rise Fast Mask

Curtain rises quickly on hover.

Side Curtain Mask

Curtain parts horizontally on hover.

Diagonal Wipe BL

Diagonal wipe reveals from bottom-left corner on hover.

Diagonal Wipe TR

Diagonal wipe reveals from top-right corner on hover.

#hover #animation #gradient

Dots Grow Mask

Dots multiply and grow to fill on hover.

Edge In Mask

Mask contracts from edges inward on hover.

Fade Blur Mask

Content blurs in with fade on hover.

#hover #filter

Fade Flip X Mask

Content flips X-fades in on hover.

Fade Flip Y Mask

Content flips Y-fades in on hover.

Fade Rotate Mask

Content rotates-fades in on hover.

Fade Skew Mask

Content skews-fades in on hover.

Fade Slide Down Mask

Fades in while sliding down on hover.

Fade Slide Up Mask

Fades in while sliding up on hover.

Fade Zoom Mask

Content zoom-fades in on hover.

Grid Emerge Mask

Grid pattern emerges across the element on hover.

Iris Wipe Mask

Iris-like circle wipe reveals on hover.

Jigsaw Assemble Mask

Jigsaw pieces assemble on hover.

Linear Wipe Bottom

Linear wipe reveals content from bottom on hover.

Linear Wipe Left

Linear wipe reveals content from left on hover.

Linear Wipe Right

Linear wipe reveals content from right on hover.

Linear Wipe Top

Linear wipe reveals content from top on hover.

Mosaic Tile Mask

Mosaic tiles flip in on hover.

Page Turn 3D Mask

Page-like 3D turn reveals on hover.

#hover #transform #3d

Pixelate Reveal Mask

Pixelated mosaic reveals on hover.

Puzzle Piece Mask

Puzzle pieces fit together on hover.

Quad Four Mask

Four quadrants animate on hover.

Radial Mask Grow

Radial mask reveals content from center outward on hover.

Radial Mask Shrink

Background mask shrinks toward center on hover.

Rotate Blur In Mask

Rotates and blurs in on hover.

Scatter Gather Mask

Scattered pieces gather together on hover.

Slide Rotate Mask

Slides and rotates to reveal on hover.

Split Cross Mask

Element splits in four cross-sections on hover.

Split Diagonal Mask

Element splits diagonally on hover.

Split Horizontal Mask

Element splits horizontally to reveal on hover.

Split Vertical Mask

Element splits vertically to reveal on hover.

Spotlight Cursor Mask

Spotlight reveals around the cursor on hover.

Stair Step Mask

Staircase pattern reveals on hover.

Wave Sweep Mask

Wavy mask sweeps across on hover.

Zigzag Trace Mask

Zigzag pattern traces across on hover.

Zoom Blur In Mask

Zoom-blur reveals content on hover.

Melt Drip

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

#gradient #hover #border

Melt Drip Down

Element melts and drips down on hover.

Melt Wax

Melts like wax on hover.

Morph Blob

Morphs into organic blob on hover.

Morph Circle

Element morphs into a circle on hover.

Morph Diamond

Morphs into diamond on hover.

Morph Heart

Morphs into heart shape on hover.

Morph Hexagon

Morphs into hexagon on hover.

Morph Star

Morphs into star shape on hover.

Mosaic Assemble

Mosaic tiles assemble on hover.

Mosaic Disperse

Mosaic tiles disperse on hover.

Mosaic Tile Flip

A 3x3 grid of small tiles flips in 3D in a staggered wave on hover.

#gradient #hover #3d

Motion Smear

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

#gradient #hover #border

#hover #transform #shadow

Motion Streak

Motion streak trail follows on hover.

Neon Pink Glow

Hot pink neon glow surrounds on hover.

#hover #shadow #border

#hover #transform #shadow

Night Vision

Green phosphor night-vision tint on hover.

Orange Shift

Hue rotates to orange on hover.

Orbit Circle

Circular orbital path on hover.

#hover #border

Orbit Ellipse

Elliptical orbit on hover.

#hover #border

Orbit Revolve

Satellite revolves on hover.

Orbit Spin

Orbital spin on hover.

Origami Fold

Element folds like origami on hover.

Oscillate Sine

Smooth sine-wave oscillation on hover.

Oscillate Square

Square-wave step oscillation on hover.

Oscillate Swing

Element oscillates back and forth on hover.

Oscillate Triangle

Triangle-wave linear oscillation on hover.

Outer Glow Expand

Outer glow ring expands outward on hover.

#hover #shadow

Paint Brush

Brush stroke paint on hover.

Paint Roller

Paint roller coats on hover.