#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

Suede Brush

Brushed suede texture with directional grain pattern.

#gradient #transform #shadow

Live preview Toggles

Summer / Autumn

Summer sun transitions to a falling autumn leaf.

#gradient #transform #shadow

Live preview Toggles

Sun / Moon Sky Slide

Orb crosses a gradient sky from blue day to indigo night, swapping its glow.

#gradient #shadow #border

Live preview Toggles

Sunny / Rainy

Sun shifts into a rain cloud as the sky turns stormy gray.

#gradient #transform #shadow

Live preview Toggles

Sunrise / Sunset

Sun rises at dawn and sets at dusk across a horizon track.

#gradient #transform #shadow

Live preview Toggles

Sunset Glow

Warm sunset gradient with a glowing amber knob.

#gradient #transform #shadow

Live preview Toggles

Sunstone Spark

Sunstone orange with aventurescent sparkles.

#gradient #transform #shadow

Live preview Toggles

Supernova Burst

Star explodes into a brilliant supernova burst of light.

#gradient #transform #shadow

Live preview Toggles

Taffeta Rustle

Crisp taffeta fabric with audible rustle shimmer.

#animation #gradient #transform

Live preview Toggles

Tangerine Zest

Zesty tangerine orange with citrus sheen.

#gradient #transform #shadow

Live preview Toggles

Tanzanite Rare

Rare tanzanite violet-blue with violet glow.

#gradient #transform #shadow

Live preview Toggles

Tapestry Weave

Woven tapestry pattern with rich colored threads.

#gradient #transform

Live preview Toggles

Tarnished Silver

Tarnished silver with dark oxidation patina around the edges.

#gradient #transform #shadow

Live preview Toggles

Teal Mist

Misty teal fog with soft green-blue knob.

#gradient #transform #shadow

Live preview Toggles

Tempo Slow / Fast

Knob spins slow when off and accelerates when toggled on.

#animation #gradient #transform

Live preview Toggles

Terracotta Clay

Earthy terracotta clay with rustic natural texture.

#gradient #transform

Live preview Toggles

Thunder Cloud

Storm cloud darkens and crackles with thunder.

#gradient #transform

Live preview Toggles

Thunder Storm

Lightning bolt crackles to life on a stormy track.

#animation #gradient #transform

Live preview Toggles

Tidal Wave

Wave layer rises and falls beneath the knob as it slides.

#animation #gradient #transform

Live preview Toggles

Tide Pool

Tranquil tide pool ripples with marine life colors.

#animation #gradient #transform

Live preview Toggles

Titanium / Chrome

Dark titanium knob polishes to a mirror chrome finish.

#gradient #transform #shadow

Live preview Toggles

Titanium Forged

Forged titanium with hardened steel knob.

#gradient #transform #shadow

Live preview Toggles

Topaz Sun

Golden topaz with sun-yellow glow.

#gradient #transform #shadow

Live preview Toggles

Torch Flame

Torch flame flickers to life when the toggle ignites.

#animation #gradient #transform

Live preview Toggles

Tornado Form

Tornado funnel cloud forms spinning across the track.

#animation #gradient #transform

Live preview Toggles

Tourmaline Stripe

Tourmaline watermelon stripe with pink-green knob.

#gradient #transform #shadow

Live preview Toggles

Traffic Light Toggle

A horizontal traffic light slider where the knob moves from red stop to green go.

#gradient #shadow #border

Live preview Toggles

Traffic Cone

Orange cone marker shifts to redirect traffic.

#gradient #transform

Live preview Toggles

Tube Amp

Vacuum tube glows warm orange when the amp powers up.

#gradient #transform #shadow

Live preview Toggles

Tumbleweed Roll

Western tumbleweed rolls across the dusty desert track.

#animation #gradient #transform

Live preview Toggles

Turbine Spin

Power turbine blades spin to generate energy.

#animation #gradient #transform

Live preview Toggles

Turquoise Tide

Turquoise tide with rippling wave knob.

#gradient #transform #shadow

Live preview Toggles

UFO Abduct

UFO descends with a tractor beam to abduct.

#gradient #transform #shadow

Live preview Toggles

Umbrella Open

Knob transforms into a canopy as rain appears on the track.

#gradient #transform

Live preview Toggles

UV Glow

Blacklight UV glow makes the knob fluoresce in the dark.

#gradient #transform #shadow

Live preview Toggles

Velour Soft

Plush velour texture with deep pile soft surface.

#gradient #transform #shadow

Live preview Toggles

Velvet Drape

Soft velvet texture drapes across the luxurious track.

#gradient #transform #shadow

Live preview Toggles

Velvet / Linen

Velvet knob transitions to a woven linen texture on toggle.

#gradient #transform #shadow

Live preview Toggles

Verdant Leaf

Verdant green leaf with nature tone knob.

#gradient #transform #shadow

Live preview Toggles

Vine Grow

Green vine curls across the track as it grows toward the knob.

#gradient #transform #shadow

Live preview Toggles

Vintage Radio Dial

Vintage radio dial knob rotates to tune the frequency.

#gradient #transform #shadow

Live preview Toggles

Vinyl Scratch

Vinyl record knob spins and scratches across the track.

#animation #gradient #transform

Live preview Toggles

Violet Storm

Dark violet storm clouds with electric purple knob.

#gradient #transform #shadow

Live preview Toggles

Violet Twilight

Twilight violet with dusk purple knob.

#gradient #transform #shadow

Live preview Toggles

Volcano Erupt

Volcano crater erupts spewing lava and sparks.

#animation #gradient #transform

Live preview Toggles

Volume Knob Bars

Knob slides across an equalizer-style track; bars gray out when muted.

#gradient #border #transform

Live preview Toggles

Vortex / Calm

Spinning vortex knob calms to a steady dot on toggle.

#animation #gradient #transform

Live preview Toggles

Vortex Spin

Spiraling vortex pulls the knob into a swirling center.

#animation #gradient #transform

Live preview Toggles

Warm / Bright Tone

Track color temperature shifts from warm amber to cool cyan.

#gradient #transform #shadow

Live preview Toggles

Warm / Cool Thermostat

Thermometer knob glides between warm amber and cool blue.

#gradient #transform #shadow

Live preview Toggles

Whale Tail

Whale tail fluke rises and dives through the surface.

#gradient #transform

Live preview Toggles

Whirl Pool

Spinning whirlpool swirls water around the knob.

#animation #gradient #transform

Live preview Toggles

Whirl / Still

Whirling knob stops still on the rose track when toggled.

#animation #gradient #transform

Live preview Toggles

Win / Lose

Trophy gleams for a win, broken for a loss.

#gradient #transform #shadow

Live preview Toggles

Windmill Spin

Windmill knob blades spin up when the breeze is on.

#animation #gradient #transform

Live preview Toggles

Winter / Spring

Cold snowflake melts into a fresh spring sprout.

#gradient #transform #shadow

Live preview Toggles

Wood / Stone

Wood-grain knob turns to a stone texture on toggle.

#gradient #transform #shadow

Live preview Toggles

X-Ray Vision

Skeleton pattern reveals through the track when x-rayed.

#animation #gradient #transform

Live preview Toggles

Yes / No Switch

Green YES and red NO labels flank a sliding knob that changes color.

#gradient #border #transform

Live preview Toggles

Zen Rocks

Smooth pebbles raked in a sand garden shift position.

#gradient #transform #shadow

Live preview Toggles

Zephyr Breeze

Soft pastel breeze lines flow across the airy track.

#animation #gradient #transform

Live preview Toggles

Zircon Spark

Zircon crystal with diamond-bright spark.

#animation #gradient #transform

Live preview Toggles

Zoom Lens

Camera lens zooms in with aperture ring adjusting.

#gradient #transform #shadow

Popular tags