#gradient CSS effects

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

Live preview Loaders

Escalator

Escalator steps circulating endlessly with handrail.

#animation #gradient

Live preview Loaders

Event Horizon

Black hole event horizon pulling matter in.

#animation #gradient #transform

Live preview Loaders

F1 Race Car

Formula 1 car speeding across with motion blur stripes.

#animation #gradient

Live preview Loaders

Fan Blade

Electric fan blades spinning.

#animation #gradient #transform

Live preview Loaders

Figure Skate Spin

Figure skater spinning in place.

#animation #gradient #transform

Live preview Loaders

Film Strip

Film strip scrolling by.

#animation #gradient #border

Live preview Loaders

Fire Orb Spin

Mystical fire orb spinning.

#animation #gradient #transform

Live preview Loaders

Firefly

Fireflies glowing randomly in the night.

#animation #gradient #transform

Live preview Loaders

Fish Swim

Fish swimming back and forth with tail wagging.

#animation #gradient #transform

Live preview Loaders

Flash Burst

Camera flash bursting repeatedly.

#animation #gradient #transform

Live preview Loaders

Flower Bloom

Flower petals opening and closing around a yellow center.

#animation #gradient #transform

Live preview Loaders

Foehn Wind

Warm dry foehn wind descending.

#animation #gradient #transform

Live preview Loaders

Fog Drift

Fog wisps drifting across.

#animation #gradient #filter

Live preview Loaders

Origami Fold Unfold

Origami paper folding and unfolding.

#animation #gradient #transform

Live preview Loaders

Football Spiral

Football spinning in a spiral pass across the field.

#animation #gradient #transform

Live preview Loaders

Fountain Jet

Fountain jet pulsing water.

#animation #gradient #transform

Live preview Loaders

Frankenstein Bolt

Frankenstein with neck bolts.

#animation #gradient #shadow

Live preview Loaders

Freefall Drop

A ball falling, hitting the ground, and bouncing back up.

#animation #gradient #transform

Live preview Loaders

Frisbee Throw

Frisbee spinning through air.

#animation #gradient #transform

Live preview Loaders

Frog Jump

Frog leaping up with legs extending and tucking.

#animation #gradient #transform

Live preview Loaders

Frost Bite

Frost creeping across a surface.

#animation #gradient #transform

Live preview Loaders

Frost Form

Frost pattern forming on surface.

#animation #gradient #transform

Live preview Loaders

Frying Pan

Frying pan with food tossing in the air as it cooks.

#animation #gradient #transform

Live preview Loaders

Galaxy Spiral

Spiral galaxy with rotating arms.

#animation #gradient #transform

Live preview Loaders

Garlic Peel

Garlic clove peeling.

#animation #gradient #transform

Live preview Loaders

Gas Pump

Gas pump nozzle with fuel gauge filling up.

#animation #gradient

Live preview Loaders

Gate Lift

Gate lifting up and down.

#animation #gradient #transform

Live preview Loaders

Ghost Float

Ghost floating with wavy bottom.

#animation #gradient #transform

Live preview Loaders

Gift Box Open

Gift box with opening lid.

#animation #gradient #transform

Live preview Loaders

Glider

Hang glider soaring in a figure-eight through the sky.

#animation #gradient #transform

Live preview Loaders

Glitch TV

Television screen with RGB channel split and glitch noise.

#animation #gradient #transform

Live preview Loaders

Glockenspiel Bar

Glockenspiel bars shimmering.

#animation #gradient #shadow

Live preview Loaders

Glow Pulse

Glowing orb pulsing with light.

#animation #gradient #transform

Live preview Loaders

Golf Swing

Golf club swinging to strike a ball off the tee.

#animation #gradient #transform

Live preview Loaders

Gramophone Horn

Vintage gramophone horn with sound waves.

#animation #gradient #transform

Live preview Loaders

Guiro Scrape

Guiro being scraped with stick.

#animation #gradient #transform

Live preview Loaders

Gust Front

Gust front advancing as wall.

#animation #gradient #transform

Live preview Loaders

Haboob

Haboob wall of dust advancing.

#animation #gradient #transform

Live preview Loaders

Haboob Wall

Tall haboob dust wall advancing.

#animation #gradient #transform

Live preview Loaders

Handpan Tone

Handpan with shimmering tone fields.

#animation #gradient #transform

Live preview Loaders

Harmonic Drive

Harmonic drive flex spline.

#animation #gradient #border

Live preview Loaders

Harp Strings

Harp strings vibrating in sequence down the frame.

#animation #gradient #transform

Live preview Loaders

Valentine Heart Pulse

Valentine heart pulsing with love.

#animation #gradient #transform

Live preview Loaders

Heat Haze

Heat haze shimmering over surface.

#animation #gradient #transform

Live preview Loaders

Helmet Glow

Knight helmet with glowing visor.

#animation #gradient #transform

Live preview Loaders

Hexagon Pulse

Hexagon pulsing inward and outward.

#animation #gradient #transform

Live preview Loaders

Hinge Swing

Door swinging on hinge.

#animation #gradient #transform

Live preview Loaders

Hockey Puck

Hockey puck sliding across the ice rink surface.

#animation #gradient #shadow

Live preview Loaders

Honey Drip

Honey dripping slowly.

#animation #gradient #transform

Live preview Loaders

Horseshoe Toss

Horseshoe arcing toward post.

#animation #gradient #transform

Live preview Loaders

Hot Air Balloon

Hot air balloon rising with the burner flame flickering.

#animation #gradient #transform

Live preview Loaders

Hourglass Flip

A warm amber hourglass shape that periodically flips itself.

#gradient #animation #glass

Live preview Loaders

Hula Hoop Twirl

Hula hoop twirling around waist.

#animation #gradient #transform

Live preview Loaders

Hurdle Leap

Runner leaping over hurdle.

#animation #gradient #transform

Live preview Loaders

Hurricane Eye

Hurricane with rotating eye wall.

#animation #gradient #transform

Live preview Loaders

Hyperspace

Stars streaking past in hyperspace.

#animation #gradient #transform

Live preview Loaders

Incense Clock

Incense stick burning with smoke.

#animation #gradient #transform

Live preview Loaders

Indeterminate Bar

A sliver of light sweeping back and forth across a track.

#gradient #animation #shadow

Live preview Loaders

Induction Motor

Induction motor with squirrel cage.

#animation #gradient #transform

Live preview Loaders

Jack-O-Lantern Glow

Jack-o-lantern with glowing face.

#animation #gradient #shadow

Live preview Loaders

Jam Spread

Jam spreading on bread.

#animation #gradient #transform

Live preview Loaders

Javelin Throw

Javelin flying through air.

#animation #gradient #transform

Live preview Loaders

Jellyfish

Jellyfish pulsing as it drifts with tentacles flowing.

#animation #gradient #transform

Live preview Loaders

Jet Engine

Jet engine turbine fan blades spinning inside the cowling.

#animation #gradient #transform

Live preview Loaders

Jigsaw Piece

Jigsaw puzzle piece fitting.

#animation #gradient #transform

Live preview Loaders

Joystick

Joystick tilting in circles.

#animation #gradient #transform

Live preview Loaders

Joystick Wiggle

Arcade joystick wiggling back and forth on its base.

#animation #gradient #transform

Live preview Loaders

Juicer Press

Citrus juicer half spinning to extract juice.

#animation #gradient #transform

Live preview Loaders

Kaleidoscope

Kaleidoscope pattern morphing colors.

#animation #gradient #transform

Live preview Loaders

Kettle Steam

Whistling kettle with steam puffing from its spout.

#animation #gradient #transform

Live preview Loaders

Kettlebell Swing

Kettlebell swinging on arc.

#animation #gradient #transform

Live preview Loaders

Kite Fly

Kite flying with waving tail.

#animation #gradient #transform

Live preview Loaders

Knob Turn

Knob turning back and forth.

#animation #gradient #transform

Live preview Loaders

Labyrinth

Concentric labyrinth spiral rotating.

#animation #gradient #transform

Live preview Loaders

Lamp Glow

Oil lamp with glowing flame.

#animation #gradient #transform

Live preview Loaders

Lemon Squeeze

Lemon being squeezed.

#animation #gradient #transform

Live preview Loaders

Level Balance

Spirit level with bubble in tube.

#animation #gradient #transform

Live preview Loaders

Level Bubble

Spirit level with bubble sliding to find center.

#animation #gradient #shadow

Live preview Loaders

Lighter Flame

Lighter with flickering flame.

#animation #gradient #transform

Live preview Loaders

Lighthouse Beam

Lighthouse with rotating beam.

#animation #gradient #transform

Live preview Loaders

Lighthouse Beam Sweep

Lighthouse with sweeping beam.

#animation #gradient #transform

Live preview Loaders

Line Flow

Horizontal lines flowing across.

#animation #gradient

Live preview Loaders

Lollipop Spin

Lollipop spinning spiral.

#animation #gradient #transform

Live preview Loaders

Lunar Module

Lunar module descending with thrusters.

#animation #gradient #transform

Live preview Loaders

Maracas Shake

Maracas shaking rhythmically.

#animation #gradient #transform

Live preview Loaders

Marathon Run

Runner sprinting on track.

#animation #gradient #transform

Live preview Loaders

Marimba Mallet

Marimba mallet bouncing between two wooden bars.

#animation #gradient #transform

Live preview Loaders

Mars Rover

Mars rover rolling across terrain.

#animation #gradient #transform

Live preview Loaders

Mechanical Clock

Mechanical clock with ticking hands.

#animation #gradient #transform

Live preview Loaders

Meteor Shower

Multiple meteors falling diagonally.

#animation #gradient #transform

Live preview Loaders

Meter Dial

Analog meter dial sweeping.

#animation #gradient #transform

Live preview Loaders

Metronome

A wooden metronome body with an amber arm ticking side to side.

#gradient #animation #border

Live preview Loaders

Microburst

Microburst of downward wind.

#animation #gradient #transform

Live preview Loaders

Microphone Feedback

Microphone emitting feedback waves.

#animation #gradient #transform

Live preview Loaders

Milk Splash

Milk glass with splash droplets.

#animation #gradient #transform

Effects tagged #gradient

Popular tags