LibraryCSSÜcretsiz Saf CSS Efekt Kütüphanesi

#gradient CSS efektleri

"gradient" etiketiyle eşleşen 5.189 ücretsiz saf CSS efekti. Hepsi kopyala-yapıştır hazır; kullanmak için kütüphane veya derleme adımı gerekmez.

Canlı incele Navigasyon

Light Fade Overlay Navbar

Side panel nav with a fading light translucent backdrop.

#hover #animation #gradient

Canlı incele İlerleme

Oasis Stairs Progress

A staircase of five blocks where the climbed tiers are lit and a marker sits on the current step.

#staircase #flexbox #gradient

Canlı incele İlerleme

Origami Cusp Progress

Eight paper facets alternate their crease direction and the five set folds carry the colour.

#origami #clip-path #flexbox

Canlı incele Kaydırıcılar

Bloom Vapor Slider

A striped sunset disc rises behind chrome lettering while a neon grid runs to the horizon.

#slider #vaporwave #gradient

Canlı incele Kaydırıcılar

Quartz Gradient Slider

A prismatic quartz rail runs the full spectrum under a bezelled white knob.

#slider #gradient #spectrum

Canlı incele Sekmeler

Cobalt Stepper Tabs

Numbered cobalt nodes on a rail, with the connecting line filling as you advance.

#transform #gradient #stepper

Canlı incele Metin

Burlap Coarse

Coarse burlap fabric weave.

Canlı incele Metin

Cloud Cover Grey

Overcast grey cloud cover on text.

#animation #gradient #shadow

Canlı incele Metin

Color Blocks Three

Three vertical color blocks.

Canlı incele Metin

Cosmic Nebula

Swirling nebula clouds of purple and pink within text.

#animation #gradient

Canlı incele Metin

Grid Dots

Evenly-spaced dot grid in monochrome.

Canlı incele Metin

Jade Translucent

Translucent jade green stone.

#gradient #filter

Canlı incele Metin

Manor Estate

Grand manor estate on text.

#animation #gradient #shadow

Canlı incele Metin

Palace Grand

Grand opulent palace gold on text.

#animation #gradient #shadow

Canlı incele Metin

Skyline Silhouette

Dark city skyline silhouette on text.

#animation #gradient #filter

Canlı incele Metin

Torch Pass

A warm torch light passes across the text.

#animation #gradient

Canlı incele İpuçları

Confetti Pop

Tooltip with confetti pop animation above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

Emerald Tip

Emerald green tooltip with subtle shimmer above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

Icon Crown

Tooltip with crown icon above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

Overline Draw

Tooltip with animated overline drawing above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

Retro 80s

Retro 80s neon sunset tooltip above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

Rich Avatar

Tooltip with user avatar above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

Shimmer Loading

Shimmer loading placeholder tooltip above the trigger.

#hover #animation #gradient

Canlı incele İpuçları

Sky Blue Info

Sky blue tooltip with airy lightness above the trigger.

#hover #gradient #transform

Canlı incele Anahtarlar

Burlap Rough

Rough burlap surface with rustic coarse fibers.

#gradient #transform

Canlı incele Anahtarlar

Cinnabar Red

Ancient cinnabar red with carved stone knob.

#gradient #transform #shadow

Canlı incele Anahtarlar

Citrine Glow

Glowing citrine yellow with golden warmth.

#gradient #transform #shadow

Canlı incele Anahtarlar

Coins / Gems

Gold coin stash converts to sparkling gems.

#gradient #transform #shadow

Canlı incele Anahtarlar

Crimson Flame

Burning crimson flame with flickering glow.

#gradient #transform #shadow

Canlı incele Anahtarlar

Dense / Sparse

Dense dot texture spreads out into a sparse pattern on toggle.

#gradient #transform #shadow

Canlı incele Anahtarlar

Hematite Iron

Hematite iron-black with metallic sheen.

#gradient #transform #shadow

Canlı incele Anahtarlar

Tornado Form

Tornado funnel cloud forms spinning across the track.

#animation #gradient #transform

Canlı incele Anahtarlar

Tourmaline Stripe

Tourmaline watermelon stripe with pink-green knob.

#gradient #transform #shadow

Canlı incele Anahtarlar

Yarn Unwind

Knobby yarn ball rolls across leaving a thread behind.

#gradient #transform

Canlı incele Rozetler

Gold Medal Achievement

Gold medal achievement badge with shine effect.

#gradient #shadow #border

Canlı incele Rozetler

Trophy Achievement

Trophy-style achievement badge with golden shine.

#gradient #shadow #border

Canlı incele Rozetler

Candy Cane Badge

Candy-cane badge with diagonal red-white stripes.

#gradient #shadow #border

Canlı incele Rozetler

Cloud Fly Badge

Fly.io cloud badge with red-magenta fly styling.

#gradient #shadow #border

Canlı incele Rozetler

Cloud GCP Badge

Google Cloud Platform badge with four-color split styling.

#gradient #shadow #border

Canlı incele Rozetler

Cloud Heroku Badge

Heroku cloud badge with purple-paper plane styling.

#gradient #shadow #border

Canlı incele Rozetler

Cyber Glitch Grid Badge

Magenta/cyan glitchy badge with a dark grid overlay.

#gradient #shadow #border

Canlı incele Rozetler

Debossed Badge

Debossed badge with inset text effect.

#gradient #shadow #border

Canlı incele Rozetler

Deco Fringe Badge

Badge with fringe-strip bottom edge.

#gradient #shadow

Canlı incele Rozetler

Deco Stitch Cross Badge

Badge with cross-stitch pattern border accent.

#gradient #shadow #border

Canlı incele Rozetler

Desert Sand Badge

Sandy beige badge with subtle dune texture.

#gradient #shadow #border

Canlı incele Rozetler

Doc Spreadsheet Badge

Spreadsheet badge with grid pattern and green tone.

#gradient #shadow #border

Canlı incele Rozetler

Eco Bio Badge

Biodegradable badge with sprout glyph and green tone.

#gradient #shadow #border

Canlı incele Rozetler

Eco Recycle Badge

Recycle badge with triangular recycle arrows.

#gradient #shadow #border

Canlı incele Rozetler

Eco Wind Badge

Wind-energy badge with cyan turbine styling.

#gradient #shadow #border

Canlı incele Rozetler

Embossed Badge

Embossed badge with raised text effect.

#gradient #shadow #border

Canlı incele Rozetler

Exclusive Gold Badge

Gold exclusive badge with metallic sheen.

#gradient #transform #shadow

Canlı incele Rozetler

Forest Moss Badge

Mossy-textured badge with earthy green gradient.

#gradient #border

Canlı incele Rozetler

Framework Angular Badge

Angular framework badge with shield-shape red styling.

#gradient #shadow #border

Canlı incele Rozetler

Framework Deno Badge

Deno framework badge with dark-blue dinosaur styling.

#gradient #shadow #border

Canlı incele Rozetler

Framework Next Badge

Next.js framework badge with mono black-white styling.

#gradient #shadow #border

Canlı incele Rozetler

Framework React Badge

React framework badge with atom-orbit styling.

#gradient #shadow #border

Canlı incele Rozetler

BG Slide FX Badge

Animated badge with sliding gradient background.

#animation #gradient #shadow

Canlı incele Rozetler

Color Cycle FX Badge

Animated badge that cycles through hue rotations.

#animation #gradient #transform

Canlı incele Rozetler

Fill Flood FX Badge

Animated badge with flooding radial fill overlay.

#animation #gradient #transform

Canlı incele Rozetler

Hue Shift FX Badge

Animated badge with gentle hue-shift in/out oscillation.

#animation #gradient #transform

Canlı incele Rozetler

Letter Pop FX Badge

Animated badge with sequential letter pop animation.

#animation #gradient #shadow

Canlı incele Rozetler

Soft Pulse FX Badge

Animated badge with gentle soft-pulse scale animation.

#animation #gradient #transform

Canlı incele Rozetler

Rubber FX Badge

Animated badge with elastic rubber-band stretch.

#animation #gradient #transform

Canlı incele Rozetler

Shadow Grow FX Badge

Animated badge with growing drop shadow.

#animation #gradient #transform

Canlı incele Rozetler

Shadow Shrink FX Badge

Animated badge with shrinking shadow press effect.

#animation #gradient #transform

Canlı incele Rozetler

Swing FX Badge

Animated badge that swings like a pendulum from top anchor.

#animation #gradient #transform

Canlı incele Rozetler

Typing Loop FX Badge

Animated badge with looping typewriter cursor blink.

#animation #gradient #shadow

Canlı incele Rozetler

Garden Bumblebee Badge

Bumblebee-striped badge with yellow-black banding.

#gradient #shadow #border

Canlı incele Rozetler

Hue Rotate Pill

Pill that cycles through all hues via hue-rotate filter.

#animation #gradient #transform

Canlı incele Rozetler

Language CSS Badge

CSS language badge with blue paint-brush styling.

#gradient #shadow #border

Canlı incele Rozetler

Language Java Badge

Java language badge with coffee-cup red styling.

#gradient #shadow #border

Canlı incele Rozetler

Platform Web Badge

Web platform badge with browser-globe accent and blue tone.

#gradient #shadow #border

Canlı incele Rozetler

Retro 80s Badge

Retro 80s synthwave badge with neon gradient.

#gradient #transform #shadow

Canlı incele Rozetler

Striped Ribbon

Banner ribbon with diagonal striped pattern.

#gradient #shadow

Canlı incele Rozetler

Sale Flash Badge

Bright sale badge with a flashing shine sweep.

#animation #gradient #transform

Canlı incele Rozetler

Gold Wax Seal

Gold wax seal with shimmering surface.

#gradient #transform #shadow

Canlı incele Rozetler

Diamond Shape Badge

Diamond/rhombus shaped badge with rotated square styling.

#gradient #shadow

Canlı incele Rozetler

Hex Shape Badge

Hexagonal badge with clipped polygon edges.

#gradient #shadow

Canlı incele Rozetler

Shield Shape Badge

Shield-shaped badge with classic heraldic silhouette.

#gradient #shadow

Canlı incele Rozetler

Triangle Shape Badge

Triangular badge with polygon clipped corners.

#gradient #shadow

Canlı incele Rozetler

Space Rocket Badge

Rocket-shaped badge with tapered nose and fins.

#gradient #shadow #border

Canlı incele Rozetler

Tier Silver Shield Badge

Silver-tier shield-shaped badge with polished metallic feel.

#gradient #transform #shadow

Canlı incele Rozetler

Trust 2FA Badge

Two-factor authentication badge with key-pad glyph.

#gradient #shadow #border

Canlı incele Rozetler

Trust Privacy Badge

Privacy shield badge with eye-blocked glyph and purple tone.

#gradient #shadow #border

Canlı incele Rozetler

Trust Verified Business Badge

Verified-business badge with checkmark and blue tone.

#gradient #shadow #border

Canlı incele Rozetler

Vapor Sunset Badge

Vaporwave sunset gradient badge with retro gradient bars.

#gradient #shadow #border

Canlı incele Rozetler

Volcano Lava Badge

Lava-flow badge with animated red-orange ember gradient.

#animation #gradient #shadow

Canlı incele Rozetler

Weather Rain Badge

Rainy weather badge with blue raindrop styling.

#gradient #shadow #border

Canlı incele Rozetler

Weather Rainbow Badge

Rainbow weather badge with multi-color arc styling.

#gradient #shadow #border

Canlı incele Rozetler

Y2K Bubble Badge

Glossy pink bubble badge with translucent highlight.

#gradient #shadow #border

Canlı incele Arka Planlar

Accretion Disk

A superheated accretion disk spirals around a central black mass.

#animation #gradient #transform

Canlı incele Arka Planlar

Arctic Ice

Vast arctic ice floes drift slowly across a freezing polar sea.

#animation #gradient #transform

Canlı incele Arka Planlar

Argyle Diamond

Argyle diamond pattern in layered colors with diagonal overlay lines.

#animation #gradient #filter

Canlı incele Arka Planlar

Autumn Harvest

Golden harvest fields roll under a warm autumn sky.

#animation #gradient #transform

Canlı incele Arka Planlar

Late Autumn

Late autumn leaves drift through bare branches in chill air.

#animation #gradient