#gradient CSS effects

4,959 free, pure-CSS effects match the "gradient" tag. Each is copy-ready and needs no library or build step.

Live preview Hover

Underglow

Glow emanates from beneath on hover.

#hover #gradient #transform

Live preview Hover

Vanish

Content vanishes into a blur haze while a smoke cloud puffs outward on hover.

#gradient #hover #border

Live preview Hover

Venetian Tilt

Vertical venetian blind slats rotate in 3D to let light through on hover.

#gradient #hover #3d

Live preview Hover

Vignette Darken

Edges darken with vignette on hover.

#hover #gradient

Live preview Hover

Warm Overlay

Warm orange overlay washes in on hover.

#hover #gradient

Live preview Hover

Wipe Linear

Linear wipe sweep on hover.

#hover #gradient #transform

Live preview Hover

Wipe Radial

Radial wipe reveal on hover.

#hover #gradient #transform

Live preview Hover

Zoom Blur

Content zooms in with a radial blur, simulating a dolly zoom on hover.

#gradient #hover #shadow

Live preview Loaders

Abacus Bead

Abacus beads sliding on rod.

#animation #gradient #transform

Live preview Loaders

Accordion Bellows

Accordion bellows expanding and contracting.

#animation #gradient #transform

Live preview Loaders

Acorn Drop

Acorn bouncing after falling from a tree.

#animation #gradient #transform

Live preview Loaders

Airplane Propeller

Airplane propeller spinning rapidly with motion blur.

#animation #gradient #transform

Live preview Loaders

Alien Spaceship

Flying saucer hovering with bobbing motion.

#animation #gradient #transform

Live preview Loaders

Alternator

Alternator generating current.

#animation #gradient #shadow

Live preview Loaders

Amp Tube Glow

Vacuum tube amplifier glowing.

#animation #gradient #transform

Live preview Loaders

Antimatter

Antimatter particles annihilating.

#animation #gradient #transform

Live preview Loaders

Aqueduct Flow

Roman aqueduct with water flow.

#animation #gradient

Live preview Loaders

Arcade Token

Arcade token spinning in air.

#animation #gradient #transform

Live preview Loaders

Arch Keystone

Arch with pulsing keystone.

#animation #gradient #transform

Live preview Loaders

Archery Bow

Bow drawing arrow back.

#animation #gradient #transform

Live preview Loaders

Astrolabe

Astrolabe with rotating rings.

#animation #gradient #transform

Live preview Loaders

Atom Spinner

Three electrons orbiting a glowing nucleus at different speeds.

#gradient #animation #shadow

Live preview Loaders

Atomic Clock

Atomic clock with pulsing atom symbol.

#animation #gradient #transform

Live preview Loaders

Aurora Borealis

Northern lights shimmering across a starry sky.

#animation #gradient #transform

Live preview Loaders

Aurora Curtain

Aurora curtain rippling in the sky.

#animation #gradient #transform

Live preview Loaders

Axe Chop

Axe chopping down into a wooden log repeatedly.

#animation #gradient #transform

Live preview Loaders

Axle Spin

Axle spinning between wheels.

#animation #gradient #transform

Live preview Loaders

Badminton Shuttle

Badminton shuttlecock arcing through the air.

#animation #gradient #transform

Live preview Loaders

Bagel Bite

Bagel being bitten.

#animation #gradient #transform

Live preview Loaders

Bagpipe Drone

Bagpipes with inflating bag.

#animation #gradient #transform

Live preview Loaders

Balance Beam

Gymnast walking on balance beam.

#animation #gradient #transform

Live preview Loaders

Balloon Rise

Balloon rising into the sky.

#animation #gradient #transform

Live preview Loaders

Bar Pulse

Vertical bars pulsing in height like EQ.

#animation #gradient #transform

Live preview Loaders

Barbell Press

Barbell being pressed up.

#animation #gradient

Live preview Loaders

Barometer

Barometer dial with needle.

#animation #gradient #transform

Live preview Loaders

Equalizer Bars

Five green bars pulsing like an audio equalizer from the bottom.

#gradient #animation #border

Live preview Loaders

Baseball Pitch

Baseball stitching spinning as it flies past home plate.

#animation #gradient #transform

Live preview Loaders

Basketball Bounce

Basketball bouncing with rotation and shadow.

#animation #gradient #transform

Live preview Loaders

Bass Clef

Bass clef symbol with two dots.

#animation #gradient #shadow

Live preview Loaders

Bat Fly Moon

Bat flying past the moon.

#animation #gradient #transform

Live preview Loaders

Charging Battery

A green fill repeatedly charging up a battery from empty to full.

#gradient #animation #border

Live preview Loaders

Beacon Flash

Beacon light flashing.

#animation #gradient #shadow

Live preview Loaders

Ball Bearing

Ball bearing balls rolling in cage.

#animation #gradient #transform

Live preview Loaders

Bee Buzz

Bee buzzing in a figure-eight with blurry wings.

#animation #gradient #transform

Live preview Loaders

Beer Foam

Beer with rising foam.

#animation #gradient #transform

Live preview Loaders

Belt Conveyor

Conveyor belt with items moving.

#animation #gradient

Live preview Loaders

Bicycle Pedal

Bicycle crank spinning with pedals going around.

#animation #gradient #transform

Live preview Loaders

Bike Chain

Bicycle chain links rotating around two sprockets.

#animation #gradient #transform

Live preview Loaders

Bingo Ball

Bingo ball popping up.

#animation #gradient #transform

Live preview Loaders

Bird Flap

Bird flapping its wings to stay aloft.

#animation #gradient #transform

Live preview Loaders

Black Dwarf

Dark star pulsing with faint energy.

#animation #gradient #shadow

Live preview Loaders

Blender Blade

Blender jar with whirring blades at the bottom.

#animation #gradient #transform

Live preview Loaders

Blizzard

Heavy snowfall with diagonal streaks.

#animation #gradient #transform

Live preview Loaders

Organic Blob Morph

Organic blob morphing smoothly.

#animation #gradient #transform

Live preview Loaders

Blue Giant

Blue giant star flickering.

#animation #gradient #transform

Live preview Loaders

Boat Anchor

Anchor lowering into the water with rippling waves.

#animation #gradient #transform

Live preview Loaders

Bobsled Run

Bobsled racing down track.

#animation #gradient #transform

Live preview Loaders

Bonfire

Large bonfire with multiple flames.

#animation #gradient #transform

Live preview Loaders

Bongo Drum

Bongo drums being played.

#animation #gradient #transform

Live preview Loaders

Bonsai Sway

Bonsai tree with twisted trunk gently swaying in the breeze.

#animation #gradient #transform

Live preview Loaders

Bouncing Ball

A red ball bouncing with a shadow that shrinks at the apex.

#gradient #animation #shadow

Live preview Loaders

Bow Arrow Pull

Bow string being pulled with arrow.

#animation #gradient #transform

Live preview Loaders

Bowling Pin Fall

Bowling pins falling in sequence.

#animation #gradient #transform

Live preview Loaders

Bowling Strike

Bowling ball rolling into pins and knocking them down.

#animation #gradient #transform

Live preview Loaders

Brake Squeeze

Brake caliper squeezing disc.

#animation #gradient #transform

Live preview Loaders

Brick Stack

Bricks stacking in sequence.

#animation #gradient #transform

Live preview Loaders

Bridge Truss

Bridge truss with moving load.

#animation #gradient

Live preview Loaders

Bubble Blow

Bubbles blowing and floating.

#animation #gradient #transform

Live preview Loaders

Rising Bubbles

Translucent cyan bubbles rising and drifting up through water.

#gradient #animation #border

Live preview Loaders

Bulb Glow

Light bulb glowing on and off.

#animation #gradient #shadow

Live preview Loaders

Bulldozer

Bulldozer pushing dirt with its angled blade.

#animation #gradient #transform

Live preview Loaders

Bumper Car

A bumper car ricocheting inside a square arena.

#animation #gradient #shadow

Live preview Loaders

Bunny Hop Egg

Bunny hopping with Easter egg.

#animation #gradient #transform

Live preview Loaders

Burger Flip

Burger patty flipping.

#animation #gradient #transform

Live preview Loaders

Butter Melt

Butter pat melting.

#animation #gradient #transform

Live preview Loaders

Butterfly

Butterfly flapping colorful wings as it floats.

#animation #gradient #transform

Live preview Loaders

Button Press

Button being pressed in.

#animation #gradient #transform

Live preview Loaders

Cabasa Shake

Cabasa with beaded cylinder shaking.

#animation #gradient #transform

Live preview Loaders

Cable Car

Cable car hanging from a wire, swaying as it travels.

#animation #gradient

Live preview Loaders

Cactus Sway

Desert cactus gently swaying with arms outstretched.

#animation #gradient #transform

Live preview Loaders

Cake Candle

Birthday cake with flickering candle.

#animation #gradient #transform

Live preview Loaders

Cake Slice

Cake slice with shimmer.

#animation #gradient #shadow

Live preview Loaders

Calendar Flip

Calendar pages flipping.

#animation #gradient #transform

Live preview Loaders

Caliper Measure

Digital caliper jaws opening and closing to measure.

#animation #gradient

Live preview Loaders

Campfire

Campfire with logs and flickering flames above.

#animation #gradient #transform

Live preview Loaders

Campfire Blaze

Campfire with dancing flames.

#animation #gradient #transform

Live preview Loaders

Camshaft

Camshaft with egg-shaped lobes.

#animation #gradient #transform

Live preview Loaders

Candle Clock

Candle burning down as time passes.

#animation #gradient #transform

Live preview Loaders

Candle Flame

Candle flame flickering.

#animation #gradient #transform

Live preview Loaders

Candy Twist

Candy wrapper twisting.

#animation #gradient

Live preview Loaders

Car Wheel

Car wheel spinning fast with motion blur spokes.

#animation #gradient #transform

Live preview Loaders

Card Shuffle

Playing cards fanning out and shuffling back together.

#animation #gradient #transform

Live preview Loaders

Card Trick Flip

Playing card flipping in magic trick.

#animation #gradient #transform

Live preview Loaders

Carnival Game

Carnival milk bottle target.

#animation #gradient #shadow

Live preview Loaders

Carnival Mask

Venetian carnival mask with feathers.

#animation #gradient #transform

Popular tags