Most Popular CSS Effects (Page 53)

Live preview Hover

Grayscale Reveal

Starts grayscale, hover reveals full color.

#hover #gradient #transform

Live preview Hover

Green Shift

Hue rotates to green on hover.

#hover #transform #filter

Live preview Hover

Grow Bloom

Soft grow bloom on hover.

#hover #transform #shadow

Live preview Hover

Grow Clear

Element grows from blurred to clear on hover.

#hover #transform #filter

Live preview Hover

Halo Ring

A glowing halo ring expands on hover.

#hover #transform #shadow

Live preview Hover

Handstand

Element flips upside down on hover.

#hover #transform

Live preview Hover

Heartbeat Pulse

Element pulses like a heartbeat on hover.

#hover #animation #transform

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

Highlight Sweep

Bright highlight band sweeps across on hover.

#hover #gradient #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

Hue Cycle Partial

Hue oscillates across a partial range on hover.

#hover #animation #transform

Live preview Hover

Hue Shift Cool

Hue rotates toward cool tones on hover.

#hover #gradient #transform

Live preview Hover

Hue Shift Warm

Hue rotates toward warm tones on hover.

#hover #gradient #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

Implode In

Implodes inward on hover.

#hover #animation #transform

Live preview Hover

Infrared Heat

Infrared heat-glow on hover.

#hover #shadow

Live preview Hover

Ink Bleed

Ink bleeds outward on hover.

#hover #transform #filter

Live preview Hover

Inner Shadow Glow

Inset shadow glows from edges on hover.

#hover #shadow

Live preview Hover

Invert Flash

Colors instantly invert on hover.

#hover #filter

Live preview Hover

Invert Partial

Partial color inversion creates a surreal tone on hover.

#hover #transform #filter

Live preview Hover

Invert Strobe

Rapid inversion strobe pulses on hover.

#hover #animation #filter

Live preview Hover

Invert Toggle

Instant full color inversion on hover.

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

Iris Shrink

Iris shrinks to a point on hover.

#hover #gradient

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

3D Jolt

Quick 3D jolt animation 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

Lens Flare

Lens flare spots drift across on hover.

#hover #gradient

Live preview Hover

Lens Flare Burst

Burst of lens flares on hover.

#hover #gradient

Live preview Hover

Lens Flare Soft

Soft anamorphic lens flare on hover.

#hover #gradient #transform

Live preview Hover

Letter-Spacing Expand

Text loosens its letter-spacing and inverts color on hover.

#hover #border

Live preview Hover

Lift Card Shadow

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

#hover #shadow #border

Live preview Hover

Lightning Flash

Lightning flash on hover.

#hover #animation #shadow

Live preview Hover

Liquid Fill

Liquid fills up from bottom on hover.

#hover #gradient

Live preview Hover

Look Up

Element looks up on hover.

#hover #transform

Live preview Hover

Magenta Burst

Magenta color bursts outward on hover.

#hover #shadow

Live preview Hover

Magenta Shift

Hue rotates to magenta on hover.

#hover #transform #filter

Live preview Hover

Magnetic Button

Button translates toward the cursor for a magnetic pull feel.

#gradient #hover #shadow

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

3D Blinds Mask

Blinds fold in 3D on hover.

#hover #transform #3d

Live preview Hover

Center Out Mask

Mask expands from center outward on hover.

#hover

Live preview Hover

Checker Emerge Mask

Checkerboard pattern emerges on hover.

#hover

Live preview Hover

Circle Clip Grow

Circle clip-path grows to reveal on hover.

#hover #gradient

Live preview Hover

Circle Clip Shrink

Circle clip-path shrinks to reveal original on hover.

#hover #gradient

Live preview Hover

Diamond Clip

Diamond-shaped clip-path reveals on hover.

#hover

Live preview Hover

Hexagon Clip

Hexagon clip-path reveals on hover.

#hover

Live preview Hover

Octagon Clip

Octagon clip-path reveals on hover.

#hover

Live preview Hover

Pentagon Clip

Pentagon clip-path reveals on hover.

#hover

Live preview Hover

Triangle Clip

Triangle clip-path reveals on hover.

#hover

Live preview Hover

Clock Wipe Mask

Clock-hand wipe reveals from center on hover.

#hover

Live preview Hover

Conic Spin Grow

Conic gradient mask spins and grows on hover.

#hover

Live preview Hover

Corners Collapse Mask

Four corners collapse inward on hover.

#hover #transform

Live preview Hover

Counter Clockwise Wipe

Counter-clockwise wipe reveals on hover.

#hover

Live preview Hover

Cross Wipe Mask

Two wipes cross to form an X on hover.

#hover #transform

Live preview Hover

Cube 3D Spin Mask

Cube face rotates to reveal new content on hover.

#hover #transform #3d

Live preview Hover

Curtain Fall Fast Mask

Curtain falls quickly 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

Diagonal Wipe BL

Diagonal wipe reveals from bottom-left corner on hover.

#hover

Live preview Hover

Diagonal Wipe TR

Diagonal wipe reveals from top-right corner on hover.

#hover

Live preview Hover

Dots Grow Mask

Dots multiply and grow to fill on hover.

#hover #animation #gradient

Live preview Hover

Edge In Mask

Mask contracts from edges inward on hover.

#hover

Live preview Hover

Fade Blur Mask

Content blurs in with fade on hover.

#hover #filter

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

Grid Emerge Mask

Grid pattern emerges across the element on hover.

#hover #gradient

Live preview Hover

Iris Wipe Mask

Iris-like circle wipe reveals on hover.

#hover #gradient

Live preview Hover

Jigsaw Assemble Mask

Jigsaw pieces assemble on hover.

#hover #transform

Live preview Hover

Linear Wipe Bottom

Linear wipe reveals content from bottom on hover.

#hover

Live preview Hover

Linear Wipe Left

Linear wipe reveals content from left on hover.

#hover

Live preview Hover

Linear Wipe Right

Linear wipe reveals content from right on hover.

#hover

Live preview Hover

Linear Wipe Top

Linear wipe reveals content from top on hover.

#hover

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

Pixelate Reveal Mask

Pixelated mosaic reveals on hover.

#hover #gradient

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

Radial Mask Grow

Radial mask reveals content from center outward on hover.

#hover

Browse by category

Popular tags