Live preview Toggles
#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 Accordions
Amber Edge Accordion
A resin coloured rail down the left edge stretches to full height when open.
Live preview Accordions
Chalk Dual Line Accordion
Two line headers pair a title with a quiet subtitle and a folding caret.
Live preview Accordions
Cobalt Fill Accordion
The open header floods with cobalt blue swept in from the left hand edge.
Live preview Accordions
Coil Carton Accordion
Kraft cardboard panels with a fluted edge and a tape strip that stretches open.
Live preview Accordions
Copper Rule Accordion
No shadows at all: a hairline rule draws itself in copper when a row opens.
Live preview Accordions
Cove Swap Accordion
The trailing action word slides out and its opposite slides in on toggle.
Live preview Accordions
Cusp Zip Accordion
A zipper runs under the header and its pull travels across as the pocket opens.
Live preview Accordions
Dune Right Accordion
Everything is anchored to the right edge and the marker turns from there.
Live preview Accordions
Ember Stack Accordion
Cards overlap like a fanned deck until the chosen one steps out of the pile.
Live preview Accordions
Flint Triangle Accordion
A clipped triangle marker pivots downward when its section takes the focus.
Live preview Accordions
Frost Panel Accordion
Frosted glass panels whose chevron flips and whose text thaws in from a blur.
Live preview Accordions
Girder Team Accordion
Crew groups slide their members in from the left beside a drawn truss marker.
Live preview Accordions
Halo Curtain Accordion
Two velvet curtains part sideways to uncover the text behind each header.
Live preview Accordions
Kiln Assets Accordion
One batch opens at a time and each file draws a bar sized to how heavy it is.
Live preview Accordions
Kindle Envelope Accordion
The flap lifts on its hinge and the letter slides up out of the envelope.
Live preview Accordions
Lever Commands Accordion
A command cheat sheet whose lever arm tilts over as the monospace rows appear.
Live preview Accordions
Lull Map Accordion
A paper map spreads out of its creases and the fold shading fades as it opens.
Live preview Accordions
Mesa Contact Accordion
A short question list closed off by a footer that offers a contact link.
Live preview Accordions
Nickel Switch Accordion
Every header carries a small metal switch that slides over as the row opens.
Live preview Accordions
Obsidian Arrow Accordion
The arrow head slides forward and turns a quarter turn while the text swipes in.
Live preview Accordions
Onyx FAQ Accordion
A quiet FAQ list whose plus sign rotates into a minus as the answer drops.
Live preview Accordions
Prairie Key Accordion
Keyboard shortcut badges sit in the header and press down while open.
Live preview Accordions
Quartz Clip Accordion
The panel is wiped open from the left edge with an animated clip path.
Live preview Accordions
Socket Permissions Accordion
Permission rows squash open from the top edge to explain why access is requested.
Live preview Accordions
Spiral Fan Accordion
Blades sweep out from one pivot like a paper fan while the note appears.
Live preview Accordions
Turbine Account Accordion
Account sections tilt down on a hinge in real perspective instead of sliding open.
Live preview Accordions
Valley Zebra Accordion
Alternating row tints keep a dense list readable while sections expand.
Live preview Accordions
Valve Logs Accordion
Log levels collapse into groups and the valve wheel turns a quarter when opened.
Live preview Accordions
Wisp Cabinet Accordion
Filing cabinet drawers slide toward you and throw a shadow while they stay out.
Live preview Avatars
Nickel Flip Card Avatar
The avatar flips on its vertical axis to reveal the member role on the back.
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Brutalist Outline Badge
Brutalist badge with transparent body and thick outline.
Live preview Badges
Live preview Badges
Brutalist Yellow Badge
Brutalist yellow badge with thick border and offset shadow.
Live preview Badges
Live preview Badges
Notification Count Badge
A bell with a counter that pops each time the number would change.
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Fill Bottom Up FX Badge
Animated badge with rising fill from bottom to top.
Live preview Badges
Fill Sweep FX Badge
Animated badge with sweeping left-to-right fill overlay.
Live preview Badges
Live preview Badges
Glitch Slice FX Badge
Animated badge with horizontal slice-glitch distortion.
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Live preview Badges
Letter Drop FX Badge
Animated badge with dropping-letter translateY motion.
Live preview Badges
Live preview Badges
Live preview Badges
Light Sweep FX Badge
Animated badge with diagonal light-sweep highlight.
Live preview Badges
Particle Float FX Badge
Animated badge with floating particle accent overlay.
Live preview Badges
Live preview Badges
Shake-Bounce FX Badge
Animated badge with quick shake-and-bounce motion.
Live preview Badges
Live preview Badges
Live preview Badges