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

Spaceship Launch

Spaceship launch tooltip with rocket-trail gradient.

#hover #gradient #transform

Live preview Tooltips

Spotlight Radial

Tooltip with a radial spotlight gradient highlighting its center.

#hover #gradient #transform

Live preview Tooltips

Spring Bloom

Soft pastel spring-bloom tooltip with floral hints.

#hover #gradient #transform

Live preview Tooltips

St Patrick Clover

Lucky green St Patrick's Day clover tooltip.

#hover #gradient #transform

Live preview Tooltips

Static TV

Tooltip shows TV static before content above the trigger.

#hover #animation #gradient

Live preview Tooltips

Diagonal Stripe Background

Tooltip with diagonal candy-stripe background pattern.

#hover #gradient #transform

Live preview Tooltips

Horizontal Stripe Background

Tooltip with horizontal candy-stripe background pattern.

#hover #gradient #transform

Live preview Tooltips

Vertical Stripe Background

Tooltip with vertical candy-stripe background pattern.

#hover #gradient #transform

Live preview Tooltips

Summer Sun

Bright summer-sun tooltip with warm yellow glow.

#hover #gradient #transform

Live preview Tooltips

Sun Flare

Sun flare tooltip with bright golden radiating glow.

#hover #gradient #transform

Live preview Tooltips

Sunrise Glow

Warm sunrise gradient tooltip with golden glow.

#hover #gradient #transform

Live preview Tooltips

Sunset Blaze

Vibrant sunset-blaze gradient tooltip.

#hover #gradient #transform

Live preview Tooltips

Sunset Gradient

Warm sunset gradient tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Supernova Burst

Supernova burst tooltip with radiating white-yellow explosion.

#hover #gradient #transform

Live preview Tooltips

Terracotta Clay

Earthy terracotta tooltip with a textured clay feel.

#hover #gradient #transform

Live preview Tooltips

Thanksgiving Leaf

Autumn leaf-styled Thanksgiving tooltip.

#hover #gradient #transform

Live preview Tooltips

Thunderstorm Night

Dark stormy night tooltip with electric lightning accent.

#hover #gradient #transform

Live preview Tooltips

Tick Marks Bottom

Tooltip with tick-mark decorations along its bottom edge.

#hover #gradient #transform

Live preview Tooltips

Tick Marks Left

Tooltip with tick-mark decorations along its left edge.

#hover #gradient #transform

Live preview Tooltips

Tick Marks Right

Tooltip with tick-mark decorations along its right edge.

#hover #gradient #transform

Live preview Tooltips

Tick Marks Top

Tooltip with tick-mark decorations along its top edge.

#hover #gradient #transform

Live preview Tooltips

Ticket Stub

Tooltip styled like a raffle ticket stub above the trigger.

#hover #gradient #transform

Live preview Tooltips

Topaz Yellow

Topaz yellow gem tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Underline Draw

Tooltip with animated underline drawing above the trigger.

#hover #gradient #transform

Live preview Tooltips

User Card

User card tooltip with avatar and details above the trigger.

#hover #gradient #transform

Live preview Tooltips

Valentine Heart

Romantic pink valentine heart tooltip.

#hover #gradient #transform

Live preview Tooltips

Vaporwave Tip

Vaporwave pink-cyan gradient tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Violet Dream

Soft violet dreamy tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Volcano Erupt

Volcano-erupt tooltip with molten red-orange glow.

#hover #gradient #transform

Live preview Tooltips

Watercolor

Watercolor paint tooltip with soft edges above the trigger.

#hover #gradient #transform

Live preview Tooltips

Wave Pattern Background

Tooltip with a wavy background pattern.

#hover #gradient #transform

Live preview Tooltips

Winter Snowflake

Frosty winter-snowflake tooltip with cool blue tones.

#hover #gradient #transform

Live preview Tooltips

Wood Grain

Wood-grain texture tooltip above the trigger.

#hover #gradient #transform

Live preview Tooltips

Zigzag Pattern Background

Tooltip with a zigzag background pattern.

#hover #gradient #transform

Live preview Toggles

Acid Drip

Toxic green knob leaves a corrosive trail as it slides.

#gradient #transform #shadow

Live preview Toggles

Acorn Fall

Acorn knob tumbles from the oak tree across the autumn track.

#animation #gradient #transform

Live preview Toggles

Acrylic Clear

Transparent acrylic knob with sharp glossy edges.

#gradient #transform #shadow

Live preview Toggles

Agate Band

Banded agate with layered color stripes.

#gradient #transform #shadow

Live preview Toggles

Alexandrite Shift

Alexandrite color-shift from green to red-violet.

#gradient #transform #shadow

Live preview Toggles

Allegro / Adagio

Knob spins fast (allegro) or slow (adagio) on the emerald track.

#animation #gradient #transform

Live preview Toggles

AM / PM

Morning AM flips to evening PM with a sun arc.

#gradient #transform #shadow

Live preview Toggles

Amber Fossil

Amber fossil with trapped prehistoric inclusion.

#gradient #transform #shadow

Live preview Toggles

Amber Sun

Amber sun glow with radiant warm knob.

#gradient #transform #shadow

Live preview Toggles

Amber Veil

Soft amber veil with honey-tinted knob.

#gradient #transform #shadow

Live preview Toggles

Amethyst / Citrine

Purple amethyst knob shifts to a sunny citrine yellow.

#gradient #transform #shadow

Live preview Toggles

Amethyst Spark

Sparkling amethyst purple with crystal facet.

#gradient #transform #shadow

Live preview Toggles

Amethyst Violet

Amethyst violet crystal with mystic glow.

#gradient #transform #shadow

Live preview Toggles

Anodized Aluminum

Anodized aluminum with vibrant colored oxide layer.

#gradient #transform #shadow

Live preview Toggles

Aqua Bubble

Floating aqua bubble with iridescent rim glow.

#gradient #transform #shadow

Live preview Toggles

Arcade Coin

Retro arcade coin slot activates when the coin drops.

#gradient #transform #shadow

Live preview Toggles

Arrow Pierce

Sharp arrow knob pierces through the track when fired.

#gradient #transform #shadow

Live preview Toggles

Asteroid Spin

Rough asteroid knob tumbles through space when active.

#gradient #transform #shadow

Live preview Toggles

Aurora Borealis

Northern lights shimmer over an emerald knob.

#animation #gradient #transform

Live preview Toggles

Aurora Glow

Soft polar aurora glow swells behind the sliding knob.

#gradient #transform #shadow

Live preview Toggles

Aurora Shimmer

Soft aurora shimmer dances across the polar night.

#animation #gradient #transform

Live preview Toggles

Aurora Veil

Northern lights shimmer across the track as the glowing knob slides.

#animation #gradient #transform

Live preview Toggles

Autumn / Winter

Autumn leaf turns into a delicate winter snowflake.

#gradient #transform #shadow

Live preview Toggles

Azure Sky

Clear azure sky blue with drifting cloud knob.

#gradient #transform #shadow

Live preview Toggles

Bamboo Green

Fresh bamboo green stalk with light knob.

#gradient #transform #shadow

Live preview Toggles

Barricade Flip

Construction barricade flips from stop to go.

#gradient #transform #3d

Live preview Toggles

Bass / Treble

Equalizer knobs favor low bass or high treble.

#gradient #transform #shadow

Live preview Toggles

Begin / End

Gradient sweeps blue to purple as the knob slides with a subtle skew.

#gradient #transform #shadow

Live preview Toggles

Bellows Expand

Camera bellows expand and contract as the knob moves.

#gradient #transform

Live preview Toggles

Beryl Sea

Sea-green beryl gem with aqua clarity.

#gradient #transform #shadow

Live preview Toggles

Binary Flow

Binary digits stream across the track as data flows.

#animation #gradient #transform

Live preview Toggles

Binary / Quantum

0/1 binary knob superposes into a quantum sphere on toggle.

#gradient #transform #shadow

Live preview Toggles

Black Hole

Light bends around the gravitational pull of a black hole.

#gradient #transform #shadow

Live preview Toggles

Bloodstone Dark

Dark green bloodstone with red speckles.

#gradient #transform #shadow

Live preview Toggles

Bolt Strike

Lightning bolt crackles across the track when struck.

#animation #gradient #transform

Live preview Toggles

Bolt Tighten

Hexagonal bolt rotates and tightens into place.

#gradient #transform #shadow

Live preview Toggles

Brass / Platinum

Yellow brass knob shifts to a cool platinum shine.

#gradient #transform #shadow

Live preview Toggles

Brocade Pattern

Ornate brocade jacquard pattern with golden threads.

#gradient #transform

Live preview Toggles

Bronze Age

Aged bronze patina with antique knob.

#gradient #transform #shadow

Live preview Toggles

Brushed Steel

Industrial brushed steel with directional grain lines.

#gradient #transform #shadow

Live preview Toggles

Bubble Pop

Glassy bubble knob pops to a larger size when activated.

#gradient #transform #shadow

Live preview Toggles

Bubble Rise

Air bubbles rise upward through the aquatic track.

#animation #gradient #transform

Live preview Toggles

Buoyant / Sinking

Buoyant knob floats then sinks beneath the water on toggle.

#gradient #transform #shadow

Live preview Toggles

Burgundy Rich

Deep burgundy wine with luxurious knob.

#gradient #transform #shadow

Live preview Toggles

Burnished Gold

Burnished gold surface with soft satin golden sheen.

#gradient #transform #shadow

Live preview Toggles

Big Red Button

Big red emergency button depresses when pressed.

#gradient #transform #shadow

Live preview Toggles

Cactus Bloom

Desert cactus sprouts a vibrant pink bloom when watered.

#gradient #transform

Live preview Toggles

Camera Shutter

Camera lens iris dilates open when the camera is enabled.

#gradient #border #transform

Live preview Toggles

Camouflage / Revealed

Camouflage-pattern track clears to reveal a bright knob.

#gradient #transform #shadow

Live preview Toggles

Candy Stripe Toggle

Playful candy-colored toggle with a striped knob and bouncy spring.

#gradient #shadow #border

Live preview Toggles

Canvas Weave

Heavy canvas weave with visible coarse threads.

#gradient #transform

Live preview Toggles

Canyon Echo

Canyon walls echo a sound wave across the desert track.

#gradient #transform

Live preview Toggles

Cassette Rewind

Cassette reels spin in reverse as the knob slides back.

#animation #gradient #transform

Live preview Toggles

Cat / Dog Morph

Knob slides between a cat face and a dog face with a soft pop morph.

#gradient #shadow #border

Live preview Toggles

Celadon Soft

Soft celadon green-grey with sage knob.

#gradient #transform #shadow

Live preview Toggles

Ceramic Glaze

Glossy ceramic glaze with reflective knob.

#gradient #transform #shadow

Live preview Toggles

Cerise Pop

Bright cerise cherry red popping knob.

#gradient #transform #shadow

Live preview Toggles

Charcoal Matte

Matte charcoal black with no-shine knob.

#gradient #transform #shadow

Live preview Toggles

Charge / Discharge

Battery knob charges green and discharges red on toggle.

#gradient #transform #shadow

Live preview Toggles

Charred Wood

Charred shou sugi ban wood with deep burnt texture.

#gradient #transform

Live preview Toggles

Chartreuse Glow

Bright chartreuse neon glow toggle.

#gradient #transform #shadow

Popular tags