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

Orbit / Station

Orbiting moon knob docks at a station on toggle.

#animation #gradient #transform

Live preview Toggles

Orbital Ring

Satellite orbits a planetary knob as it slides across.

#animation #gradient #transform

Live preview Toggles

Orchid Bloom

Orchid purple-pink bloom with petal knob.

#gradient #transform #shadow

Live preview Toggles

Organza Crisp

Crisp organza fabric with a subtle iridescent shimmer.

#animation #gradient #transform

Live preview Toggles

Oxidized Copper

Copper surface oxidizing to verdigris patina green.

#gradient #transform

Live preview Toggles

Patina Iron

Aged iron with rustic patina and weathered texture.

#gradient #transform #shadow

Live preview Toggles

Pearl Dew

Pearl morning dew with translucent sheen.

#gradient #transform #shadow

Live preview Toggles

Pearl Glow

Luminous pearl white with iridescent sheen.

#gradient #transform #shadow

Live preview Toggles

Pearl / Onyx

Iridescent pearl knob darkens to a glossy onyx black.

#gradient #transform #shadow

Live preview Toggles

Pearlescent Shine

Pearlescent surface with soft lustrous pearl sheen.

#animation #gradient #transform

Live preview Toggles

Pendulum Swing

Grandfather clock pendulum swings rhythmically across.

#animation #gradient #transform

Live preview Toggles

Periwinkle Dawn

Soft periwinkle dawn with sky-blue knob.

#gradient #transform #shadow

Live preview Toggles

Persimmon Warm

Warm persimmon orange with autumn glow.

#gradient #transform #shadow

Live preview Toggles

Petal Fall

Sakura petal drifts down across the spring track.

#animation #gradient #transform

Live preview Toggles

Pewter Bloom

Pewter grey with subtle bloom glow.

#gradient #transform #shadow

Live preview Toggles

Pewter Mist

Misty pewter grey with subtle haze knob.

#gradient #transform #shadow

Live preview Toggles

Pewter Shade

Muted pewter grey with metallic knob.

#gradient #transform #shadow

Live preview Toggles

Pine Cone

Woody pine cone knob scales open when dried.

#gradient #transform

Live preview Toggles

Piston Pump

Hydraulic piston pumps up and down with mechanical rhythm.

#animation #gradient #transform

Live preview Toggles

Pitch / Flat

Knob moves vertically up for high pitch and levels flat on toggle.

#gradient #transform #shadow

Live preview Toggles

Planet Ring

Ringed planet knob orbits with its ring tilted in space.

#gradient #transform #shadow

Live preview Toggles

Platinum Edge

Polished platinum with sharp edge knob.

#gradient #transform #shadow

Live preview Toggles

Polished Brass

Mirror-polished brass with warm golden reflective glow.

#animation #gradient #transform

Live preview Toggles

Porcelain Doll

Delicate porcelain white with smooth glossy knob.

#gradient #transform #shadow

Live preview Toggles

Porcelain Smooth

Glossy porcelain with smooth translucent glaze.

#gradient #transform #shadow

Live preview Toggles

Powder Coat

Durable powder-coated surface with matte finish.

#gradient #transform #shadow

Live preview Toggles

Power Button Toggle

Circular power symbol that lights up with a pulsing ring when active.

#gradient #animation #shadow

Live preview Toggles

Power Surge

Lightning power surge crackles around the active knob.

#animation #gradient #transform

Live preview Toggles

Prism Shine

Prism knob refracts incoming light into a rainbow beam.

#gradient #transform #shadow

Live preview Toggles

Pulsar Beam

Pulsar star emits rotating beams of radiation.

#animation #gradient #transform

Live preview Toggles

Pyrite Gold

Fool's gold pyrite with cubic shine.

#gradient #transform #shadow

Live preview Toggles

Quantum Spin

Particle-like knob spins on its axis while transitioning states.

#animation #gradient #transform

Live preview Toggles

Quartz / Obsidian

Clear quartz knob darkens into black obsidian glass.

#gradient #transform #shadow

Live preview Toggles

Quartz Vein

Quartz crystal vein with mineral sparkle.

#gradient #transform #shadow

Live preview Toggles

Quasar Jet

Quasar emits a brilliant jet of energy across the track.

#gradient #transform #shadow

Live preview Toggles

Quill Write

Quill pen knob leaves an ink trail as it slides.

#gradient #transform

Live preview Toggles

Radar Blip

Single radar blip pulses outward when target is detected.

#animation #gradient #transform

Live preview Toggles

Radar Sweep

Radial sweep rotates across the dark scope as the knob moves.

#animation #gradient #transform

Live preview Toggles

Sun / Rain Cloud

Sky flips between a shining sun and a gray cloud with falling raindrops.

#gradient #animation #shadow

Live preview Toggles

Rainbow Arc

A rainbow arc sweeps across the track when toggled on.

#gradient #transform #shadow

Live preview Toggles

Record Light

REC indicator blinks red when recording is active.

#animation #gradient #transform

Live preview Toggles

Resin Glass

Clear resin glass knob with depth and embedded particles.

#gradient #transform #shadow

Live preview Toggles

Retro Cartridge

Game cartridge slides into the slot with retro flair.

#gradient #transform #shadow

Live preview Toggles

Retro Rocker Switch

Vintage panel rocker switch that tilts diagonally between ON and OFF positions.

#gradient #shadow #border

Live preview Toggles

Ripple Pond

Stone drops creating ripples across the still pond surface.

#animation #gradient #transform

Live preview Toggles

Ripple Wave

Concentric ripples emanate from the knob on toggle.

#animation #gradient #transform

Live preview Toggles

River Bend

Winding river curves around the knob on the verdant track.

#gradient #transform

Live preview Toggles

River / Lake

River current knob becomes a still lake on the teal track.

#gradient #transform #shadow

Live preview Toggles

Robot Eye

Robotic eye glows red when armed, calming blue when safe.

#gradient #transform #shadow

Live preview Toggles

Rocket Launch

Rocket ignites and blasts off with a flame trail.

#animation #gradient #transform

Live preview Toggles

Roll / Halt

Wheel knob spins while rolling and stops dead when halted.

#animation #gradient #transform

Live preview Toggles

Rose Quartz

Rose quartz crystal with pink translucent glow.

#gradient #transform #shadow

Live preview Toggles

Rosewood Grain

Rosewood grain wood with polished knob.

#gradient #transform #shadow

Live preview Toggles

Rubber Grip

Rubber grip texture with raised non-slip dots.

#gradient #transform #shadow

Live preview Toggles

Ruby / Emerald

Crimson ruby knob transforms into a vivid emerald green.

#gradient #transform #shadow

Live preview Toggles

Ruby Heart

Ruby red heart with deep crimson glow.

#gradient #transform #shadow

Live preview Toggles

Rust Patina

Rust orange patina with verdigris knob.

#gradient #transform #shadow

Live preview Toggles

Rust Texture

Corroded rust texture with orange-brown oxidation spots.

#gradient #transform

Live preview Toggles

Sage Whisper

Muted sage green with subtle whisper tone.

#gradient #transform #shadow

Live preview Toggles

Sand Dune

Desert sand dune shape shifts across the arid track.

#gradient #transform

Live preview Toggles

Sandstone Grain

Sandstone with layered sedimentary grain texture.

#gradient #transform

Live preview Toggles

Sapphire Blue

Deep sapphire blue with gem-like inner glow.

#gradient #transform #shadow

Live preview Toggles

Sapphire Deep

Deep sapphire blue with royal intensity.

#gradient #transform #shadow

Live preview Toggles

Sapphire / Topaz

Deep blue sapphire knob warms into a golden topaz glow.

#gradient #transform #shadow

Live preview Toggles

Satin Shimmer

Smooth satin fabric shimmers as the knob slides across.

#animation #gradient #transform

Live preview Toggles

Satin / Silk

Satin knob gains a flowing silk gradient on toggle.

#gradient #transform #shadow

Live preview Toggles

Saturate / Fade

Saturated knob fades to grayscale on the violet track.

#gradient #transform #shadow

Live preview Toggles

Scan Line

CRT scan line sweeps across the dark monitor track.

#animation #gradient #transform

Live preview Toggles

Seaweed Sway

Underwater seaweed strands sway gently in the current.

#animation #gradient #transform

Live preview Toggles

Sepia Vintage Photo

Colorful photo swatch warms to a brown sepia tone and shifts across the track.

#gradient #border #transform

Live preview Toggles

Sequin Sparkle

Sparkly sequins catch the light as the knob slides past.

#animation #gradient #transform

Live preview Toggles

Shark Fin

Shark fin surfaces above the water as the predator approaches.

#gradient #transform

Live preview Toggles

Shield Up

Energy shield activates with a protective glow barrier.

#gradient #transform #shadow

Live preview Toggles

Shutter Click

Camera shutter opens and closes with a satisfying click.

#gradient #transform

Live preview Toggles

Signal / Noise

Clean track fills with static noise texture when toggled to noise.

#gradient #transform #shadow

Live preview Toggles

Silicone Soft

Soft silicone surface with smooth matte finish.

#gradient #transform #shadow

Live preview Toggles

Silk Ripple

Pure silk fabric ripples softly with the knob movement.

#animation #gradient #transform

Live preview Toggles

Silver Moon

Silver moon glow on dark night sky.

#gradient #transform #shadow

Live preview Toggles

Slate Quartz

Slate grey quartz with crystalline sheen.

#gradient #transform #shadow

Live preview Toggles

Snow / Rain

Snowflake melts into a raindrop as precipitation changes.

#gradient #transform #shadow

Live preview Toggles

Solar Flare

Sun erupts with a flare of plasma across its surface.

#gradient #transform #shadow

Live preview Toggles

Spectrum Bloom

Color spectrum blooms from the knob center across the track.

#gradient #transform #shadow

Live preview Toggles

Spin / Stop

Continuously spinning knob halts when toggled on.

#animation #gradient #transform

Live preview Toggles

Spotlight Beam

Stage spotlight follows the knob with a cone of light.

#gradient #transform #shadow

Live preview Toggles

Spring / Autumn Leaf

Track warms from green to orange while a leaf rotates color and direction.

#gradient #shadow #border

Live preview Toggles

Spring Coil

Coiled spring compresses and releases with the toggle.

#gradient #transform

Live preview Toggles

Spring / Summer

Spring blossom gives way to a bright summer sun.

#gradient #transform #shadow

Live preview Toggles

Sprout Grow

Tiny seed sprouts and grows upward through the soil.

#gradient #transform

Live preview Toggles

Square Press Toggle

Square-edged industrial switch that physically depresses when activated.

#gradient #shadow #border

Live preview Toggles

Stage Curtain

Velvet theater curtain rises to reveal the performance.

#gradient #transform

Live preview Toggles

Stamp Press

Stamp knob presses down leaving an inked impression.

#gradient #transform

Live preview Toggles

Star Rate

Empty star fills gold with a rating pop.

#gradient #transform #shadow

Live preview Toggles

Steampunk Valve

Brass steampunk valve wheel cranks open with steam release.

#animation #gradient #transform

Live preview Toggles

Stoneware Clay

Rough stoneware clay with matte speckled surface.

#gradient #transform #shadow

Live preview Toggles

Stream / Pool

Flowing stream pattern settles into a still pool on toggle.

#animation #gradient #transform

Live preview Toggles

Stuff / Clear

Cluttered dot pattern clears out as the knob sweeps right.

#gradient #transform #shadow

Popular tags