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

Spectrum Triadic

Triadic red-yellow-blue color blocks.

#gradient

Live preview Text

Spectrum Warm

Warm red-orange-yellow spectrum.

#gradient

Live preview Text

Spiral Double

Double spiral circular pattern.

#gradient

Live preview Text

Spiral Swirl

Spinning spiral swirl with conic gradient.

#animation #gradient #transform

Live preview Text

Spotlight Focus

A circular spotlight tracks the text center revealing color.

#animation #gradient

Live preview Text

Spotlight Stage

Stage spotlight beam effect.

#gradient

Live preview Text

Spotlight Sweep

A bright spotlight sweeps across dark text, lighting it up as it passes.

#gradient #animation

Live preview Text

Spots Leopard

Leopard spot animal pattern.

#gradient

Live preview Text

Stardust Sparkle

Text shimmering with stardust sparkles.

#animation #gradient #shadow

Live preview Text

Stars Pattern

Star field scatter pattern.

#gradient

Live preview Text

Stencil Military

Military stencil spray paint.

#gradient

Live preview Text

Stratus Layer

Flat grey stratus layer over text.

#animation #gradient #filter

Live preview Text

Rainbow Stripes

Vertical rainbow stripes across the text.

#gradient

Live preview Text

Striped Text Fill

Text filled with diagonal moving candy stripes for a candy-barber look.

#gradient #animation

Live preview Text

Candy Stripes

Sweet candy-cane diagonal stripes.

#gradient

Live preview Text

Diagonal Stripes

Bold diagonal candy stripes filling the text.

#gradient

Live preview Text

Stripes Horizontal

Horizontal color stripe pattern fill.

#gradient

Live preview Text

Stripes Rainbow Bright

Bright rainbow vertical stripes.

#gradient

Live preview Text

Stripes Vertical

Vertical color stripe pattern fill.

#gradient

Live preview Text

Stripes Zebra

Zebra irregular stripe pattern.

#gradient

Live preview Text

Stucco Bumpy

Bumpy stucco wall texture.

#gradient

Live preview Text

Stupa Dome

Buddhist stupa dome on text.

#animation #gradient #shadow

Live preview Text

Submarine Periscope

Submarine periscope on text.

#animation #gradient #transform

Live preview Text

Sunbeam Rays

Radiating sunbeams bursting from text.

#animation #gradient #transform

Live preview Text

Sunflower Sun

Bright sunflower yellow with brown center on text.

#animation #gradient #transform

Live preview Text

Sunrise Glow

Warm sunrise glow rising over text.

#animation #gradient #shadow

Live preview Text

Suns Rays

Sun rays radiating pattern.

#gradient

Live preview Text

Sunset Amber

Amber sunset glow on text.

#animation #gradient #shadow

Live preview Text

Surf Wave

Surfer riding ocean wave on text.

#animation #gradient #transform

Live preview Text

Synthwave Purple

Synthwave aesthetic text in deep purple and pink.

#gradient #shadow #filter

Live preview Text

Synthwave Sunset Strip

Synthwave sunset stripe style.

#gradient

Live preview Text

Tartan Red

Red tartan plaid with green and yellow stripes.

#gradient

Live preview Text

Teal Cool

Cool teal text with a refreshing aqua gradient.

#gradient

Live preview Text

Temple Ancient

Ancient stone temple on text.

#animation #gradient #shadow

Live preview Text

Terracotta Clay

Terracotta fired clay earthy.

#gradient

Live preview Text

Theater Curtain

Red velvet theater curtain on text.

#animation #gradient #transform

Live preview Text

Thermometer Rise

Rising mercury in thermometer text.

#animation #gradient

Live preview Text

Ticker Tape

Ticker tape dash pattern.

#gradient

Live preview Text

Titanium Matte

Titanium matte gunmetal finish.

#gradient

Live preview Text

Topaz Golden

Topaz golden yellow gem.

#gradient #filter

Live preview Text

Triangle Mosaic

Triangle mosaic tile pattern.

#gradient

Live preview Text

Geo Triangles

Geometric triangle pattern in bold colors.

#gradient

Live preview Text

Tritone Forest

Forest green tritone with lime accent.

#gradient

Live preview Text

Tritone Ocean

Three ocean tones flowing vertically.

#gradient

Live preview Text

Tritone Sunset

Three-band color sunset: coral, gold, and deep purple.

#gradient

Live preview Text

Tudor Timber

Tudor half-timber house on text.

#animation #gradient #filter

Live preview Text

Turmeric Gold

Golden turmeric on text.

#animation #gradient #shadow

Live preview Text

Twilight Glow

Twilight purple-pink glow over text.

#animation #gradient #shadow

Live preview Text

Typhoon Spin

Spinning Pacific typhoon around text.

#animation #gradient #transform

Live preview Text

Uranus Tilt

Tilted cyan ice giant Uranus.

#animation #gradient #transform

Live preview Text

Vaporwave Grid Floor

Vaporwave perspective grid floor.

#gradient #shadow #filter

Live preview Text

Velvet Deep

Deep velvet plush texture.

#gradient #filter

Live preview Text

Venus Cloud

Yellow sulfuric clouds of Venus drifting.

#animation #gradient #filter

Live preview Text

Vertical News Scroll

Words scroll vertically through a gradient window like a news ticker.

#gradient #animation #border

Live preview Text

Villa Italian

Italian villa warm stucco on text.

#animation #gradient #shadow

Live preview Text

Vintage Badge Award

Vintage award badge style.

#gradient

Live preview Text

Vintage Label Canned

Vintage canned goods label.

#gradient #shadow

Live preview Text

Vintage Newspaper Print

Old newspaper halftone print.

#gradient #transform #filter

Live preview Text

Vinyl Record Spin

Spinning vinyl record groove over text.

#animation #gradient #transform

Live preview Text

Watermelon Fresh

Fresh watermelon pink and green on text.

#animation #gradient #filter

Live preview Text

Wave Sine

Sine wave flowing pattern.

#gradient

Live preview Text

Wave Square

Square wave block pattern.

#gradient #filter

Live preview Text

Waveform Oscillate

Sine waveform oscillating across text.

#animation #gradient

Live preview Text

Waves Pattern

Layered wave pattern in ocean blues.

#gradient

Live preview Text

Basket Weave

Woven basket pattern in natural tan.

#gradient

Live preview Text

Wood Grain

Text carved from warm wood-grain texture.

#gradient

Live preview Text

Zigzag Bold

Sharp zigzag stripes in electric colors.

#gradient

Live preview Text

Zigzag Smooth

Smooth zigzag wave pattern.

#gradient

Live preview Text

Zodiac Wheel

Rotating zodiac wheel of astrological signs.

#animation #gradient #transform

Live preview Tooltips

Alien UFO

Alien UFO tooltip with saucer-shape clip-path.

#hover #gradient #transform

Live preview Tooltips

Amethyst Purple

Amethyst purple gem tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Aurora Tip

Aurora borealis gradient tooltip above the trigger.

#hover #animation #gradient

Live preview Tooltips

Autumn Leaf

Warm autumn-leaf tooltip in fall colors.

#hover #gradient #transform

Live preview Tooltips

BG Conic

Tooltip with a conic gradient spin above the trigger.

#hover #animation #gradient

Live preview Tooltips

BG Dots

Tooltip with dotted pattern background above the trigger.

#hover #gradient #transform

Live preview Tooltips

BG Fill

Tooltip background fills up from below above the trigger.

#hover #gradient #transform

Live preview Tooltips

BG Gradient Anim

Tooltip with animated gradient background above the trigger.

#hover #animation #gradient

Live preview Tooltips

BG Grid

Tooltip with grid pattern background above the trigger.

#hover #gradient #transform

Live preview Tooltips

BG Stripes

Tooltip with diagonal stripes pattern above the trigger.

#hover #gradient #transform

Live preview Tooltips

BG Sweep

Tooltip with a sweeping background gradient above the trigger.

#hover #gradient #transform

Live preview Tooltips

Birthday Cake

Birthday cake tooltip with candle glow above the trigger.

#hover #gradient #transform

Live preview Tooltips

Black Hole Vortex

Black hole vortex tooltip with deep dark center glow.

#hover #gradient #transform

Live preview Tooltips

Blinds Vertical

Tooltip reveals like vertical window blinds opening.

#hover #gradient #transform

Live preview Tooltips

Border Beam

Tooltip with animated beam border above the trigger.

#hover #animation #gradient

Live preview Tooltips

Bronze Rust

Bronze rust tooltip with warm earthy tones above the trigger.

#hover #gradient #transform

Live preview Tooltips

Canvas Paint

Canvas paint texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Card Hover

Card-like tooltip that lifts up on hover above the trigger.

#hover #gradient #transform

Live preview Tooltips

Cardboard Rough

Rough cardboard texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Cave Stalactite

Cave-stalactite tooltip with sharp pointed bottom edge.

#hover #gradient #transform

Live preview Tooltips

Certificate Seal

Certificate-style tooltip with a gold seal accent.

#hover #gradient #transform

Live preview Tooltips

Chart Mini

Mini bar chart tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Checker Pattern Background

Tooltip with a checkered background pattern.

#hover #gradient #transform

Live preview Tooltips

Cherry Blossom

Soft cherry blossom pink tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Christmas Tree

Festive green Christmas tree tooltip with a star on top.

#hover #gradient #transform

Live preview Tooltips

Flame Clip

Flame-shaped tooltip with a flickering clip-path.

#hover #gradient #transform

Effects tagged #gradient

Popular tags