# transform CSS effects

Live preview Toggles

Simple / Advanced

Minus becomes a plus to unlock advanced options.

Live preview Toggles

Single / Multi

One dot multiplies into a row of dots.

Live preview Toggles

Skill / Stat

Skill star knob becomes a stat bar chart on toggle.

Live preview Toggles

Slate Quartz

Slate grey quartz with crystalline sheen.

Live preview Toggles

Sleep / Wake

Sleeping face wakes into a smile on the indigo-to-yellow track.

Live preview Toggles

Small / Large

Tiny knob grows in size to indicate large scale.

Live preview Toggles

Smooth / Rough

Smooth knob gains a rough textured surface on toggle.

Live preview Toggles

Snail / Rabbit

Slow snail darts into a quick leaping rabbit.

Live preview Toggles

Snare / Kick

Drum knob becomes a kicking shoe on the amber track.

Live preview Toggles

Snow / Rain

Snowflake melts into a raindrop as precipitation changes.

Live preview Toggles

Soar / Perch

Soaring eagle knob perches down on the sky track.

Live preview Toggles

Solar Flare

Sun erupts with a flare of plasma across its surface.

Live preview Toggles

Solid / Liquid

Solid square knob melts into a liquid blob on toggle.

Live preview Toggles

Solo / Chorus

Single dot knob multiplies into a chorus of three on toggle.

Live preview Toggles

Spark / Fizzle

Spark knob fizzles out into a fading dot on the amber track.

Live preview Toggles

Spear / Lance

Spear knob tilts into a jousting lance on toggle.

Live preview Toggles

Spectrum Bloom

Color spectrum blooms from the knob center across the track.

Live preview Toggles

Spin / Stop

Continuously spinning knob halts when toggled on.

Live preview Toggles

Spotlight Beam

Stage spotlight follows the knob with a cone of light.

#gradient #shadow #border

Live preview Toggles

Spring / Autumn Leaf

Track warms from green to orange while a leaf rotates color and direction.

Live preview Toggles

Spring Coil

Coiled spring compresses and releases with the toggle.

Live preview Toggles

Spring / Summer

Spring blossom gives way to a bright summer sun.

Live preview Toggles

Sprout Grow

Tiny seed sprouts and grows upward through the soil.

#gradient #shadow #border

Live preview Toggles

Square Press Toggle

Square-edged industrial switch that physically depresses when activated.

Live preview Toggles

Stage Curtain

Velvet theater curtain rises to reveal the performance.

Live preview Toggles

Stage / Prod

Stage theatre knob becomes a factory on the slate track.

Live preview Toggles

Stamina / Health

Green stamina knob becomes a red heart on toggle.

Live preview Toggles

Stamp Press

Stamp knob presses down leaving an inked impression.

Live preview Toggles

Stamp / Seal

Rubber stamp knob becomes a wax seal on the crimson track.

Live preview Toggles

Standby / Active

Power symbol knob glows green when the device goes active.

Live preview Toggles

Star / Cross

Five-point star morphs into a plus cross shape.

Live preview Toggles

Star Rate

Empty star fills gold with a rating pop.

Live preview Toggles

Stars Twinkle

Dark night sky fills with twinkling stars when on.

Live preview Toggles

Start / Stop

Knob scales from small stop to large go with red-to-green track shift.

Live preview Toggles

Steampunk / Cyber

Gear knob becomes a neon cyber symbol on toggle.

Live preview Toggles

Steampunk Valve

Brass steampunk valve wheel cranks open with steam release.

Live preview Toggles

Stoneware Clay

Rough stoneware clay with matte speckled surface.

Live preview Toggles

Stop / Go

Stop sign flips to a green go light.

Live preview Toggles

Stop / Go Sign

Octagonal stop sign rotates to a green go signal.

Live preview Toggles

Straight / Curved

Straight-edged knob bends into a curved moon shape.

Live preview Toggles

Stream / Buffer

Streaming antenna knob becomes a buffering hourglass on toggle.

Live preview Toggles

Stream / Pool

Flowing stream pattern settles into a still pool on toggle.

Live preview Toggles

Strengthen / Weaken

Knob strengthens with shadow then weakens on toggle.

Live preview Toggles

Stretch / Compress

Knob stretches tall then compresses flat on the cyan track.

Live preview Toggles

Stretch / Squash

Round knob stretches tall then squashes flat.

Live preview Toggles

Strict / Loose

Rigid grid relaxes into a loose wavy track.

Live preview Toggles

Stuff / Clear

Cluttered dot pattern clears out as the knob sweeps right.

Live preview Toggles

Suede Brush

Brushed suede texture with directional grain pattern.

Live preview Toggles

Summer / Autumn

Summer sun transitions to a falling autumn leaf.

Live preview Toggles

Summon / Dismiss

Summoned creature knob fades out when dismissed.

Live preview Toggles

Sunny / Rainy

Sun shifts into a rain cloud as the sky turns stormy gray.

Live preview Toggles

Sunrise / Sunset

Sun rises at dawn and sets at dusk across a horizon track.

Live preview Toggles

Sunset Glow

Warm sunset gradient with a glowing amber knob.

Live preview Toggles

Sunstone Spark

Sunstone orange with aventurescent sparkles.

Live preview Toggles

Supernova Burst

Star explodes into a brilliant supernova burst of light.

Live preview Toggles

Surprise / Shock

Plain face pops into a wide-eyed shocked expression.

Live preview Toggles

Sweet / Spicy

Lollipop turns into a flaming chili pepper.

Live preview Toggles

Swipe / Pinch

Knob slides on swipe and pinches (scaleX) on toggle.

Live preview Toggles

Sword / Axe

Sword knob becomes a battle axe on the iron track.

Live preview Toggles

Sword / Bow

Melee sword swaps to a ranged bow weapon.

Live preview Toggles

Sword / Shield

Sword knob morphs into a shield on the steel-blue track.

Live preview Toggles

Synth / Organic

Synthesizer knob becomes a leaf on the green track.

Live preview Toggles

Taffeta Rustle

Crisp taffeta fabric with audible rustle shimmer.

Live preview Toggles

Tangerine Zest

Zesty tangerine orange with citrus sheen.

Live preview Toggles

Tanzanite Rare

Rare tanzanite violet-blue with violet glow.

Live preview Toggles

Tap / Long

Small tap dot knob stretches into a long bar on toggle.

Live preview Toggles

Tape / Digital

Film tape knob becomes a floppy disk on the slate track.

Live preview Toggles

Tapestry Weave

Woven tapestry pattern with rich colored threads.

Live preview Toggles

Teal Mist

Misty teal fog with soft green-blue knob.

Live preview Toggles

Team / Solo

Team of dots becomes a single solo dot on toggle.

Live preview Toggles

Terracotta Clay

Earthy terracotta clay with rustic natural texture.

#transform #shadow #border

Live preview Toggles

Thicken / Thin

Knob border thickens then thins on the amber track.

Live preview Toggles

Thin / Thick

Hairline border fattens into a thick outline.

#transform #border

Live preview Toggles

Throb / Still

Throbbing knob becomes still on the emerald track.

Live preview Toggles

Thunder Cloud

Storm cloud darkens and crackles with thunder.

Live preview Toggles

Tidal Wave

Wave layer rises and falls beneath the knob as it slides.

Live preview Toggles

Tide Pool

Tranquil tide pool ripples with marine life colors.

Live preview Toggles

Tiny / Huge

Speck grows enormous with a satisfying pop.

Live preview Toggles

Torch Flame

Torch flame flickers to life when the toggle ignites.

Live preview Toggles

Torch / Lantern

Flickering torch knob becomes a steady lantern on toggle.

Live preview Toggles

Labelled Track Toggle

The ON and OFF words slide along the track so only the active one stays visible.

Live preview Toggles

Traffic Cone

Orange cone marker shifts to redirect traffic.

Live preview Toggles

Trash / Restore

Trash can flips to a restore-from-bin arrow.

Live preview Toggles

Tremolo / Steady

Knob trembles with rapid pulses and goes steady on toggle.

Live preview Toggles

Triangle / Hexagon

Knob shifts shape from triangle to hexagon via clip-path.

#border #transform #switch

Live preview Toggles

True / False Boolean

Monospace T/F letters light up in red or green as the knob slides.

Live preview Toggles

Tumbleweed Roll

Western tumbleweed rolls across the dusty desert track.

Live preview Toggles

Turbo / Eco

Rocket turbo mode shifts to a leafy eco mode.

Live preview Toggles

Turquoise Tide

Turquoise tide with rippling wave knob.

Live preview Toggles

Turtle / Cheetah

Plodding turtle accelerates into a streaking cheetah.

Live preview Toggles

Twist / Flip

Knob twists 180° on a 3D flip when toggled.

Live preview Toggles

UFO Abduct

UFO descends with a tractor beam to abduct.

Live preview Toggles

Undercover / Exposed

Sunglasses knob becomes an eye when the cover is blown.

Live preview Toggles

Undo / Redo

Curved undo arrow flips direction into redo.

Live preview Toggles

Up / Down

Up arrow rotates 180 degrees to point down.