LibraryCSSÜcretsiz Saf CSS Efekt Kütüphanesi

Anahtarlar — 850 Ücretsiz CSS Efekti (Sayfa 4)

Switch ve toggle bileşenleri, yumuşak geçişlerle.

Tümü saf CSS — kütüphane, derleme adımı veya JavaScript gerekmez. Kodu kopyalamak ve tarayıcı içi editörde denemek için ücretsiz üyelik yeterli.

Canlı incele Toggles

Fish / Bird

Fish swims through water then takes flight as a bird.

#gradient #transform #shadow

Canlı incele Toggles

Flag / Check

Red flag converts to a green check when resolved.

#transform #shadow

Canlı incele Toggles

Flashlight Beam

A flashlight body glows and a yellow beam shoots downward when turned on.

#gradient #shadow #border

Canlı incele Toggles

Flask / Beaker

Erlenmeyer flask bubbles into a graduated beaker.

#transform #shadow

Canlı incele Toggles

Flat / Embossed

Flat knob pops into an embossed 3D relief on toggle.

#transform #shadow

Canlı incele Toggles

3D Flip Switch

Knob flips in 3D space revealing an ON/OFF face as it travels across.

#3d #shadow #border

Canlı incele Toggles

Float / Sink

Knob bobs gently on a water-gradient track when floating.

#animation #gradient #transform

Canlı incele Toggles

Flower Bloom

Bud swells and blooms into a full flower.

#gradient #transform #shadow

Canlı incele Toggles

Flush / Fill

Flush knob becomes a fill tap on the blue track.

#transform #shadow

Canlı incele Toggles

Flutter / Rest

Fluttering heart knob rests steady on the pink track.

#animation #transform #shadow

Canlı incele Toggles

Fly / Land

Airplane knob becomes a landing plane on the sky track.

#transform #shadow

Canlı incele Toggles

Focus Ring

Lens focus ring rotates with depth marks as it slides.

#gradient #transform #shadow

Canlı incele Toggles

Focused / Distracted

Target stays centered when focused, scatters when distracted.

#animation #transform #shadow

Canlı incele Toggles

Fog / Clear

Misty fog peels back to reveal a clear bright sky.

#gradient #transform #shadow

Canlı incele Toggles

Fog Roll

Thick fog rolls across the eerie track obscuring the knob.

#animation #gradient #transform

Canlı incele Toggles

Foil / Plain

Shiny foil knob becomes a plain matte circle on toggle.

#gradient #transform #shadow

Canlı incele Toggles

Follow / Unfollow Heart

A gray heart pulses red and scales up with a glow when you follow.

#shadow #border #transform

Canlı incele Toggles

Follow / Block

Follow plus turns into a block no-entry sign.

#transform #shadow

Canlı incele Toggles

Format / Wipe

Format pencil knob becomes a wiped dynamite on toggle.

#transform #shadow

Canlı incele Toggles

Forte / Piano

Loud 'f' mark softens to quiet 'p' on the slate track.

#transform #shadow

Canlı incele Toggles

Forward / Backward

Fast-forward icon reverses into rewind.

#transform #shadow

Canlı incele Toggles

Free / Occupied

Vacant sign flips to occupied restroom style.

#transform #shadow

Canlı incele Toggles

Freeze / Thaw

Snowflake melts into a droplet as the cyan track warms to blue.

#transform #shadow

Canlı incele Toggles

Fresh / Rotten

Fresh apple spoils into a rotten brown one.

#transform #shadow

Canlı incele Toggles

Friend / Foe

Smiley friend knob becomes an angry foe on toggle.

#transform #shadow

Canlı incele Toggles

Frost Shard

Icy crystalline shard forms on the knob when frozen.

#animation #gradient #transform

Canlı incele Toggles

Frostbite Blue

Icy frostbite blue with frozen crystal knob.

#gradient #transform #shadow

Canlı incele Toggles

Fuchsia Bloom

Vivid fuchsia bloom with bright pink knob.

#gradient #transform #shadow

Canlı incele Toggles

Full / Empty

Vertical fill bar drains from full to empty as the knob drops.

#gradient #transform #shadow

Canlı incele Toggles

Fullscreen / Window

Expand arrows toggle to a windowed restore.

#transform #shadow

Canlı incele Toggles

Fur / Scaled

Furry knob transforms into a scaled pattern on toggle.

#gradient #transform #shadow

Canlı incele Toggles

Galaxy Spin

Spiral galaxy core rotates with cosmic arms.

#animation #gradient #transform

Canlı incele Toggles

Galaxy Spiral

Spiral galaxy arms rotate as the cosmos spins up.

#animation #gradient #transform

Canlı incele Toggles

Garnet Deep

Deep garnet red with wine-dark intensity.

#gradient #transform #shadow

Canlı incele Toggles

Garnet / Zircon

Dark red garnet knob lightens to a sparkling zircon teal.

#gradient #transform #shadow

Canlı incele Toggles

Gear Shift

Cogwheel knob rotates and shifts along a notched metallic track.

#gradient #transform #shadow

Canlı incele Toggles

Gem / Jewel

Raw gem knob cuts into a faceted jewel on the rose track.

#transform #shadow

Canlı incele Toggles

Geyser Spout

Geothermal geyser spouts water high into the air.

#gradient #transform #shadow

Canlı incele Toggles

Ghost / Fade

Solid knob becomes a translucent ghostly figure.

#animation #transform #shadow

Canlı incele Toggles

Glacier Crack

Glacial ice cracks and shifts across the frozen track.

#gradient #transform

Canlı incele Toggles

Glass / Metal

Frosted glass knob turns to a brushed metal finish.

#gradient #transform #border

Canlı incele Toggles

Glass / Rubber

Translucent glass knob turns into opaque rubber on toggle.

#transform #shadow

Canlı incele Toggles

Glide / Hover

Gliding knob hovers in place on the violet track.

#animation #transform #shadow

Canlı incele Toggles

Glissando / Step

Smooth glissando slide vs a stepped staircase knob motion.

#animation #transform #shadow

Canlı incele Toggles

Glitch Screen

Knob distorts with chromatic aberration glitch on toggle.

#animation #transform #shadow

Canlı incele Toggles

Soft Glow Switch

Minimal toggle with a soft ambient glow that intensifies when enabled.

#glow #shadow #border

Canlı incele Toggles

Gold Leaf

Luxurious gold leaf with shimmering knob.

#gradient #transform #shadow

Canlı incele Toggles

Gold / Silver

Polished gold knob turns to a sleek silver metallic.

#gradient #transform #shadow

Canlı incele Toggles

Gradient Track Fill

Track fills with a sweeping gradient that follows the knob as it slides.

#gradient #shadow #border

Canlı incele Toggles

Gradient / Solid

Rainbow gradient track flattens to a single solid hue.

#gradient #transform #shadow

Canlı incele Toggles

Granite Speckled

Speckled granite stone with multi-color flecks.

#gradient #transform

Canlı incele Toggles

Grant / Revoke

Gift grant knob becomes a revoke X on the amber track.

#transform #shadow

Canlı incele Toggles

Graphite / Diamond

Dull graphite knob crystallizes into a sparkling diamond.

#gradient #transform #shadow

Canlı incele Toggles

Graphite Matte

Pure graphite matte finish absorbing all reflections.

#transform #shadow

Canlı incele Toggles

Graphite Pulse

Graphite dark with pulsing inner glow.

#animation #gradient #transform

Canlı incele Toggles

Gravity Pull

Knob falls with gravity to the lower position.

#gradient #transform #shadow

Canlı incele Toggles

Gravity / Zero-G

Knob drops with gravity and floats up in zero-G on toggle.

#animation #transform #shadow

Canlı incele Toggles

Grayscale Swatch

A rainbow color swatch desaturates to gray and shifts under the knob.

#gradient #border #transform

Canlı incele Toggles

Grid / Scatter

Orderly grid background scatters into chaos.

#gradient #transform #shadow

Canlı incele Toggles

Grip / Let Go

Clenched fist relaxes into an open hand on the brown track.

#transform #shadow

Canlı incele Toggles

Grow / Shrink

Knob grows large then shrinks small on the green track.

#transform #shadow

Canlı incele Toggles

Halo Ring

A radiant ring expands around the knob as it lights up the track.

#gradient #transform #shadow

Canlı incele Toggles

Hammer / Mace

Hammer knob becomes a spiked mace on the bronze track.

#transform #shadow

Canlı incele Toggles

Happy / Sad

Smiley face flips to a tearful frown.

#gradient #transform #shadow

Canlı incele Toggles

Harbor / Depart

Landscape knob becomes a cruise ship as the track turns teal.

#transform #shadow

Canlı incele Toggles

Harmony / Dissonance

Knob jitters with a chaotic animation when dissonance is on.

#animation #transform #shadow

Canlı incele Toggles

Heart / Shield

Health heart morphs into an armor shield.

#animation #transform #shadow

Canlı incele Toggles

Hematite Iron

Hematite iron-black with metallic sheen.

#gradient #transform #shadow

Canlı incele Toggles

Hero / Villain

Hero knob becomes a villain on the blue-to-purple track.

#transform #shadow

Canlı incele Toggles

Hide / Show

Knob slides with a curtain-like skew reveal from dark to light track.

#transform #shadow

Canlı incele Toggles

Hi-Hat / Crash

Hi-hat knob becomes a crash burst on the yellow track.

#transform #shadow

Canlı incele Toggles

Hinge Pivot

Door panel swings on a hinge from open to closed.

#gradient #transform

Canlı incele Toggles

Hold / Drop

Holding hands knob shifts to a downward arrow when dropped.

#transform #shadow

Canlı incele Toggles

Hologram Glitch

Cyan hologram knob glitches with chromatic aberration.

#animation #gradient #transform

Canlı incele Toggles

Holographic Foil

Holographic foil shimmering with rainbow light reflections.

#animation #gradient #transform

Canlı incele Toggles

Hot / Cold Drink

Hot mug transitions to an iced beverage.

#gradient #transform #shadow

Canlı incele Toggles

HUD Display

Futuristic HUD overlay lights up with targeting brackets.

#gradient #transform #shadow

Canlı incele Toggles

Hue Rotate Rainbow

Multi-hue rainbow track continuously hue-rotates while the knob is engaged.

#gradient #animation #shadow

Canlı incele Toggles

Hue Shift / Still

Hue-shifting rainbow knob steadies on the dark track.

#animation #gradient #transform

Canlı incele Toggles

Humid / Dry

Water droplet dries into a desert cactus.

#gradient #transform #shadow

Canlı incele Toggles

Hurricane Eye

Hurricane spiral eye rotates around the calm center.

#animation #gradient #transform

Canlı incele Toggles

Hydraulic Press

Industrial hydraulic press lowers and crushes down.

#gradient #transform #shadow

Canlı incele Toggles

Ice Crack

Crystalline cracks spread across the ice as the knob presses.

#gradient #transform #shadow

Canlı incele Toggles

Ice Cream Melt

Solid ice cream cone drips as it melts.

#transform #shadow

Canlı incele Toggles

Iceberg Float

Iceberg knob floats with hidden mass below the surface.

#animation #gradient #transform

Canlı incele Toggles

Idle / Busy

Gear knob spins continuously while the device is busy.

#animation #transform #shadow

Canlı incele Toggles

In / Out

Knob zooms in tight then expands outward.

#transform #shadow

Canlı incele Toggles

Incognito / Identified

Incognito hat knob becomes an ID card on the dark track.

#transform #shadow

Canlı incele Toggles

Indigo Deep

Deep indigo night with starfield glow knob.

#gradient #transform #shadow

Canlı incele Toggles

Inflate / Deflate

Knob inflates like a balloon then deflates on toggle.

#transform #shadow

Canlı incele Toggles

Instant / Animated

No-transition snap vs a smooth animated slide.

#transform #shadow

Canlı incele Toggles

Inventory / Equip

Backpack knob becomes an equipped sword on toggle.

#transform #shadow

Canlı incele Toggles

Invert Colors

Black/white track halves swap and the yin-yang knob flips to match.

#gradient #shadow #border

Canlı incele Toggles

Iridescent Shell

Mother-of-pearl shell with iridescent shimmering colors.

#animation #gradient #transform

Canlı incele Toggles

Iron / Gold

Dark iron knob transmutes into a gleaming gold orb.

#gradient #transform #shadow

Canlı incele Toggles

Ivory Bone

Soft ivory bone white with cream knob.

#gradient #transform #shadow