#transform CSS effects

5,986 free, pure-CSS effects match the "transform" tag. Each is copy-ready and needs no library or build step.

Live preview Toggles

X-Ray Vision

Skeleton pattern reveals through the track when x-rayed.

#animation #gradient #transform

Live preview Toggles

Yarn Unwind

Knobby yarn ball rolls across leaving a thread behind.

#gradient #transform

Live preview Accordions

Amber Edge Accordion

A resin coloured rail down the left edge stretches to full height when open.

#checkbox #transform #max-height

Live preview Accordions

Flux Page Accordion

Chapters open like a book page turning over on its spine with a soft shade.

#checkbox #book #perspective

Live preview Accordions

Turbine Account Accordion

Account sections tilt down on a hinge in real perspective instead of sliding open.

#checkbox #perspective #transform

Live preview Avatars

Sway Isometric Avatar Plane

Three member tiles lie on an isometric plane that rocks slowly around its centre.

#isometric #transform #group

Live preview Badges

Confetti Burst Badge

Badge with colorful confetti burst animation.

#animation #transform

Live preview Badges

Electric Badge

Badge with electric pulse effect.

#animation #transform #shadow

Live preview Badges

Heartbeat Badge

Badge that beats like a heart.

#animation #transform

Live preview Badges

Spin Badge

Badge that spins around its center.

#animation #transform

Live preview Badges

Wobble Badge

Badge that wobbles side to side.

#animation #transform

Live preview Badges

Certified Ribbon Badge

Certified badge styled like an official ribbon stamp.

#transform #shadow #border

Live preview Badges

Corner Sale Ribbon

Diagonal corner ribbon with sale text overlay.

#transform #shadow #border

Live preview Badges

Exclusive Gold Badge

Gold exclusive badge with metallic sheen.

#gradient #transform #shadow

Live preview Badges

Color Cycle FX Badge

Animated badge that cycles through hue rotations.

#animation #gradient #transform

Live preview Badges

Fill Flood FX Badge

Animated badge with flooding radial fill overlay.

#animation #gradient #transform

Live preview Badges

Hue Shift FX Badge

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

#animation #gradient #transform

Live preview Badges

Soft Pulse FX Badge

Animated badge with gentle soft-pulse scale animation.

#animation #gradient #transform

Live preview Badges

Rubber FX Badge

Animated badge with elastic rubber-band stretch.

#animation #gradient #transform

Live preview Badges

Shadow Grow FX Badge

Animated badge with growing drop shadow.

#animation #gradient #transform

Live preview Badges

Shadow Shrink FX Badge

Animated badge with shrinking shadow press effect.

#animation #gradient #transform

Live preview Badges

Swing FX Badge

Animated badge that swings like a pendulum from top anchor.

#animation #gradient #transform

Live preview Badges

Hue Rotate Pill

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

#animation #gradient #transform

Live preview Badges

Has-Selector Filter Chips

Checked chips restyle themselves and the group header count reacts through :has().

#border #transform #has-selector

Live preview Badges

Halloween Holiday Badge

Halloween-themed badge with orange and black.

#transform #shadow #border

Live preview Badges

Live Pulse Badge

A broadcast badge whose red dot sends out a fading ring on every beat.

#animation #transform #border

Live preview Badges

Neon Cyan Badge

Dark badge with glowing cyan neon outline.

#transform #shadow #border

Live preview Badges

Pulsing Notification

Notification badge that scales pulse to grab attention.

#animation #transform #border

Live preview Badges

Admin Role Badge

Admin role badge with red shield style.

#transform #shadow #border

Live preview Badges

Sale Flash Badge

Bright sale badge with a flashing shine sweep.

#animation #gradient #transform

Live preview Badges

Gold Wax Seal

Gold wax seal with shimmering surface.

#gradient #transform #shadow

Live preview Badges

Expired Stamp

Red expired stamp with bold lettering and rotation.

#transform #border

Live preview Badges

Flagged Stamp

Red flagged stamp for important documents.

#transform #border

Live preview Badges

Internal Stamp

Blue internal stamp for company use.

#transform #border

Live preview Badges

Sample Stamp

Pink sample stamp with playful rotation.

#transform #border

Live preview Badges

Shipped Stamp

Green shipped stamp for package tracking.

#transform #border

Live preview Badges

Busy Status Dot

Red busy status dot with strong pulse.

#animation #transform #shadow

Live preview Badges

Tier Silver Shield Badge

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

#gradient #transform #shadow

Live preview Backgrounds

Accretion Disk

A superheated accretion disk spirals around a central black mass.

#animation #gradient #transform

Live preview Backgrounds

Arctic Ice

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

#animation #gradient #transform

Live preview Backgrounds

Autumn Harvest

Golden harvest fields roll under a warm autumn sky.

#animation #gradient #transform

Live preview Backgrounds

Balloon Bouquet

A bouquet of bright balloons drifts gently upward.

#animation #gradient #transform

Live preview Backgrounds

BBQ Grill Flame

A backyard barbecue grill with flames licking the grates.

#animation #gradient #transform

Live preview Backgrounds

Boxing Ring Ropes

Three boxing ring ropes tension across a blue canvas.

#animation #gradient #transform

Live preview Backgrounds

Slot Canyon

Narrow slot canyon with deep shadows and curved walls.

#animation #gradient #transform

Live preview Backgrounds

Light Caustics

Wavy light caustics dance across a pool floor in rippling patterns.

#animation #gradient #transform

Live preview Backgrounds

Celtic Spiral Knot

Triple Celtic spiral knot weaving in continuous motion.

#animation #gradient #transform

Live preview Backgrounds

Cepheid Variable

A cepheid variable star pulses regularly in brightness.

#animation #gradient #transform

Live preview Backgrounds

Grilled Cheese Melt

A grilled cheese sandwich with cheese oozing out the side.

#animation #gradient #transform

Live preview Backgrounds

Cinema Projector

A projector beam plays through dust motes in a dark theater.

#animation #gradient #transform

Live preview Backgrounds

City Fog

Fog drifts through a city skyline at dusk.

#animation #gradient #transform

Live preview Backgrounds

Civil Twilight

Purple-blue civil twilight settles with the last bright horizon band.

#animation #gradient #transform

Live preview Backgrounds

Cliff Coast

Rocky cliffs drop sharply into churning ocean waves.

#animation #gradient #transform

Live preview Backgrounds

Cocktail Shaker

A metal cocktail shaker vibrates as the drink mixes inside.

#animation #gradient #transform

Live preview Backgrounds

Coffee Ripple

Concentric ripples spread across a coffee cup surface.

#animation #gradient #transform

Live preview Backgrounds

Coffee Cup Steam

Hot coffee in a mug with steam rising in swirling wisps.

#animation #gradient #transform

Live preview Backgrounds

Halley's Comet

Halley's comet sweeps across the sky with its glowing tail.

#animation #gradient #transform

Live preview Backgrounds

Long-Tail Comet

A comet with an exceptionally long glowing tail streams across space.

#animation #gradient #transform

Live preview Backgrounds

Concert Crowd Silhouette

Silhouetted crowd dances under bright stage lights.

#animation #gradient #transform

Live preview Backgrounds

Concert Pyrotechnics

Stage pyrotechnics burst with colored sparks in a stadium.

#animation #gradient #transform

Live preview Backgrounds

Confetti Fall

Small paper rectangles tumble down the panel at mixed speeds and tilt angles.

#animation #transform #gradient

Live preview Backgrounds

Croissant Flake

A buttery croissant shedding golden flakes while steaming.

#animation #gradient #transform

Live preview Backgrounds

CRT Burn Ghost

Old CRT with persistent ghost image burning into phosphor.

#animation #gradient #transform

Live preview Backgrounds

Dance Floor Disco

A retro dance floor with floating silhouettes and rotating lights.

#animation #gradient #transform

Live preview Backgrounds

Dark Molecular Cloud

A dense dark molecular cloud obscures the stars behind it.

#animation #gradient #transform

Live preview Backgrounds

Golden Dawn

Warm golden dawn light spills across a clear sky.

#animation #gradient #transform

Live preview Backgrounds

Desert Dunes

Golden desert dunes roll beneath a warm sun with shifting sand.

#animation #gradient #transform

Live preview Backgrounds

Desert Mirage

A shimmering heat mirage distorts the desert horizon.

#animation #gradient #transform

Live preview Backgrounds

Disc Galaxy Spin

Disc galaxy rotating with bright core and spiral arms.

#animation #gradient #transform

Live preview Backgrounds

Dust Devil

A swirling dust devil spins across an arid plain.

#animation #gradient #transform

Live preview Backgrounds

Annular Solar Eclipse

An annular eclipse shows a bright ring of fire around the moon.

#animation #gradient #transform

Live preview Backgrounds

Electric Guitar Shred

Lightning-like energy bolts surround a shredding electric guitar.

#animation #gradient #transform

Live preview Backgrounds

Energy Wave

A sine-wave of energy flows horizontally across the field.

#animation #gradient #transform

Live preview Backgrounds

Fairy Dust Shimmer

Magical fairy dust particles twinkle and drift in soft pastel light.

#animation #gradient #transform

Live preview Backgrounds

Fireworks Finale

A grand finale of fireworks bursts across the night sky.

#animation #gradient #transform

Live preview Backgrounds

Fluid Pour

Colorful fluid pours down in a steady thick stream.

#animation #gradient #transform

Live preview Backgrounds

Foggy Forest

Thick fog drifts among the trunks of a misty forest.

#animation #gradient #transform

Live preview Backgrounds

Fractal Tree

Self-similar fractal tree with branching limbs growing recursively.

#animation #gradient #transform

Live preview Backgrounds

Hyperspace Jump

Hyperspace jump with starlines streaking past the viewer.

#animation #gradient #transform

Live preview Backgrounds

Landing Pad Lights

A circular helipad perimeter lights up in yellow sequence.

#animation #gradient #transform

Live preview Backgrounds

Lissajous Curve

Lissajous curve figure traced by harmonic oscillation.

#animation #gradient #transform

Live preview Backgrounds

Marble Swirl

Elegant marble veins swirl in classic white and grey stone.

#animation #gradient #transform

Live preview Backgrounds

Meteor Shower

Streaking meteors rain across a clear dark night sky.

#animation #gradient #transform

Live preview Backgrounds

Monsoon Rainforest

Tropical rainforest leaves drip under a warm monsoon downpour.

#animation #gradient #transform

Live preview Backgrounds

Monstera Leaf

Tropical monstera leaves with signature splits overlay a jungle backdrop.

#animation #gradient #transform

Live preview Backgrounds

Morning Glory

Vivid blue morning glory vines spiral upward opening to the sun.

#animation #gradient #transform

Live preview Backgrounds

Oil Slick

An oil slick shimmers with shifting rainbow interference colors.

#animation #gradient #transform

Live preview Backgrounds

Oil on Water

Oil slick spreads on water with shifting iridescent colors.

#animation #gradient #transform

Live preview Backgrounds

Paint Mixing

Thick layers of paint fold and mix together in slow motion.

#animation #gradient #transform

Live preview Backgrounds

Paint Splash

Vivid paint splashes burst and drip across a white canvas.

#animation #gradient #transform

Live preview Backgrounds

Plasma Field

Saturated overlapping blobs swirl and blend into a flowing plasma surface.

#animation #border #transform

Live preview Backgrounds

Plasma Arc

An electric plasma arc crackles between two points.

#animation #gradient #transform

Live preview Backgrounds

Plasma Torch

A bright blue plasma jet emits a thin column of superheated gas.

#animation #gradient #transform

Live preview Backgrounds

Orange Portal

Orange exit portal swirling with hot energy field.

#animation #gradient #transform

Effects tagged #transform

Popular tags