Most popular CSS effects

Live preview Toggles

Loud / Soft

Knob shrinks to soft and grows to loud with red-to-blue track.

#animation #transform #shadow

Live preview Toggles

Love Heart

Broken heart heals and beats red when loved.

Live preview Toggles

Low / High

Single bar grows into a stacked high-signal indicator.

Live preview Toggles

Magenta Pulse

Pulsing magenta glow around a hot pink knob.

Live preview Toggles

Magic / Melee

Sparkle magic knob becomes a fist for melee on toggle.

Live preview Toggles

Magic / Tech

Sparkle magic knob becomes a circuit chip on toggle.

Live preview Toggles

Magnet Attract

Knob snaps across with a magnetic attraction pull.

Live preview Toggles

Magnet Poles

Horseshoe magnet flips between north and south poles.

Live preview Toggles

Magnet / Repel

Magnet knob repels away on the steel track when toggled.

#gradient #shadow #border

Live preview Toggles

Magnetic Knob Toggle

Knob snaps across with a magnetic overshoot and attraction glow.

Live preview Toggles

Mahogany Rich

Rich mahogany wood with deep brown knob.

Live preview Toggles

Major / Minor

Happy face knob turns sad as the key switches to minor.

Live preview Toggles

Map / Compass

Treasure map knob becomes a compass on the parchment track.

Live preview Toggles

Maple Leaf

Maple leaf knob shifts from green to autumn red.

Live preview Toggles

Marble / Granite

Veined marble knob shifts to a speckled granite pattern.

Live preview Toggles

Marble Statue

White marble statue with classic veining.

Live preview Toggles

Marble Veined

White marble with elegant grey veining pattern.

Live preview Toggles

Mask / Unmask

Theatre mask morphs into a smiley face on the purple track.

Live preview Toggles

Matte / Glossy

Matte knob gains a glossy highlight reflection on toggle.

Live preview Toggles

Mauve Dusk

Mauve dusty purple with twilight knob.

Live preview Toggles

Mech / Organic

Mech robot knob becomes an organic leaf on toggle.

Live preview Toggles

Mech Shift

Mechanical panels shift and realign when transforming.

Live preview Toggles

Medieval / Future

Castle knob becomes a futuristic cityscape on toggle.

Live preview Toggles

Melody / Silence

Melody notes become a hush face on the violet track.

Live preview Toggles

Melt / Solidify

Liquid blob knob solidifies into a square on toggle.

Live preview Toggles

Mercury Bubble

Liquid mercury silver with floating bubble knob.

Live preview Toggles

Merge / Split

Merge arrows knob becomes split scissors on the blue track.

Live preview Toggles

Mesh Grid

Sport mesh fabric with breathable grid pattern.

Live preview Toggles

Metallic / Pearl

Metallic knob shifts to a soft pearlescent sheen on toggle.

Live preview Toggles

Meteor Burst

Meteor impact bursts with sparks and debris when struck.

Live preview Toggles

Meteor Shower

Meteors streak across the night sky when active.

Live preview Toggles

Metronome Tick

Metronome arm ticks back and forth keeping the beat.

Live preview Toggles

Mic / Stand

Microphone knob becomes a stop hand on the orange track.

Live preview Toggles

Midnight Bloom

Midnight blue track with blooming star knob.

Live preview Toggles

Minimal / Detailed

Single dot blooms into a detailed sparkle cluster.

Live preview Toggles

Mirror / Flip

Knob mirrors itself with a horizontal flip.

Live preview Toggles

Mirror Shine

Polished chrome knob slides with a sweeping reflection.

#gradient #transform #filter

Live preview Toggles

Mist Clear

Atmospheric mist clears to reveal what was hidden.

Live preview Toggles

Modem Dial

Vintage rotary modem dial spins to connect.

Live preview Toggles

Mono / Stereo

Single knob splits into a mirrored pair for stereo mode.

Live preview Toggles

Moon Crater

Cratered moon surface knob shifts in the lunar sky.

Live preview Toggles

Moon Phase

New moon waxes to a full moon as the knob slides.

Live preview Toggles

Moonstone Glow

Moonstone with soft adularescent sheen.

Live preview Toggles

Moor / Cast Off

Sailboat knob glides fully across the teal track when casting off.

Live preview Toggles

Morning / Evening

Rooster crows at dawn, owl hoots at dusk.

Live preview Toggles

Mosaic Tile

Pixelated mosaic tiles shift colors across the track.

Live preview Toggles

Mount / Dismount

Horse mount knob becomes a walking figure when dismounted.

Live preview Toggles

Mountain / Valley

Peak rises high then dips down into a green valley.

Live preview Toggles

Mushroom Grow

Mushroom sprouts from the ground when conditions are right.

#border #transform #clip-path

Live preview Toggles

Speaker Mute / Unmute

Speaker sound waves pulse out when unmuted and a red slash appears when muted.

Live preview Toggles

Narrow / Wide

Thin bar widens out to fill more of the track.

Live preview Toggles

Nebula Cloud

Cosmic nebula cloud swirls with pink and purple hues.

Live preview Toggles

Needle Gauge

Pressure gauge needle swings to green zone when active.

Live preview Toggles

Needle / Laser

Record needle knob becomes a laser dot on the red track.

Live preview Toggles

Needle Spin

Compass needle knob spins to point a different direction.

Live preview Toggles

Neon Plasma Switch

Dark cyberpunk switch with a glowing neon knob and electric arc effect.

#gradient #glow #shadow

Live preview Toggles

Neoprene Flex

Stretchy neoprene material with subtle flex animation.

Live preview Toggles

New / Old

Sparkling new badge fades to a vintage clock.

Live preview Toggles

Noise / Clean

Grainy noise track clears into a clean surface.

Live preview Toggles

Normal / Incognito

Smiley dons a disguise for incognito browsing.

Live preview Toggles

North / South

Compass needle swings between north and south.

Live preview Toggles

Note / Rest

Eighth note switches to a rest symbol for silence.

Live preview Toggles

Nova Burst

Stellar burst radiates from the knob as the nova ignites.

Live preview Toggles

NPC / Boss

Plain NPC knob becomes a glowing boss on toggle.

Live preview Toggles

Ocean / Beach

Deep ocean waves roll into a sunny beach scene.

Live preview Toggles

Oil Slick

Iridescent oil-slick shimmer across a dark puddle track.

#animation #transform #shadow

Live preview Toggles

Online / Away

Green online dot shifts to an amber away indicator.

Live preview Toggles

Online / Offline

Green status dot means online, red means offline.

Live preview Toggles

Onyx Shadow

Black onyx stone with mysterious shadow.

Live preview Toggles

Opal Fire

Fiery opal with multi-color flash.

Live preview Toggles

Opal / Jadeite

Multicolor opal knob focuses into a deep jadeite green.

Live preview Toggles

Opaque / Transparent

Solid knob fades to transparency on the violet track.

Live preview Toggles

Open / Close Door

Door-panel knob swings open with a 3D rotateY and red-to-green track shift.

Live preview Toggles

Open / Closed Door

Door swings open then shuts tight.

Live preview Toggles

Orbit / Gravity

Floating knob gets captured into a gravity orbit.

Live preview Toggles

Orbit / Station

Orbiting moon knob docks at a station on toggle.

Live preview Toggles

Orbital Ring

Satellite orbits a planetary knob as it slides across.

Live preview Toggles

Orchid Bloom

Orchid purple-pink bloom with petal knob.

Live preview Toggles

Organza Crisp

Crisp organza fabric with a subtle iridescent shimmer.

#transform #shadow #border

Live preview Toggles

Outline / Fill

Hollow outline knob fills in with solid color.

Live preview Toggles

Oxidized Copper

Copper surface oxidizing to verdigris patina green.

Live preview Toggles

Pack / Unpack

Packed box opens to an empty box on a brown-to-tan track.

Live preview Toggles

Pair / Unpair

Signal knob loses connection on the slate track when unpaired.

#transform #shadow #border

Live preview Toggles

Park / Drive

Gear shifter moves from P to D position.

Live preview Toggles

Past / Future

Back arrow flips forward to point into the future.

Live preview Toggles

Patina Iron

Aged iron with rustic patina and weathered texture.

Live preview Toggles

Pause / Menu

Pause bars expand into a hamburger menu.

Live preview Toggles

Pause / Resume

Pause symbol morphs into a play triangle.

Live preview Toggles

Pearl Dew

Pearl morning dew with translucent sheen.

Live preview Toggles

Pearl Glow

Luminous pearl white with iridescent sheen.

Live preview Toggles

Pearl / Onyx

Iridescent pearl knob darkens to a glossy onyx black.

Live preview Toggles

Pearlescent Shine

Pearlescent surface with soft lustrous pearl sheen.