Live preview Accordions
Gear Release Accordion
Version rows expand into change notes marked by added, fixed and changed dots.
#max-height CSS effects
34 free, pure-CSS effects match the "max-height" 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
Brass Ledger Accordion
Numbered ledger rows where the brass index chip fills as the note unrolls.
Live preview Accordions
Cascade Pill Accordion
Fully rounded pill rows relax into soft rectangles as their body appears.
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
Coral Wave Accordion
An open row keeps a slow coloured wave drifting along its underline strip.
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
Flange Glossary Accordion
Letter groups sweep a tinted wash across the header while the term list unrolls.
Live preview Accordions
Flint Triangle Accordion
A clipped triangle marker pivots downward when its section takes the focus.
Live preview Accordions
Forge Lessons Accordion
Course chapters list their lessons with a play wedge, runtime and a watched state.
Live preview Accordions
Garnet Steps Accordion
Numbered steps joined by a connector line, with only one step expanded.
Live preview Accordions
Gasket Errors Accordion
Error codes open into a cause and fix pair while the code chip picks up a ring.
Live preview Accordions
Granite Counter Accordion
Every row carries a count badge and only one section stays open at a time.
Live preview Accordions
Halo Curtain Accordion
Two velvet curtains part sideways to uncover the text behind each header.
Live preview Accordions
Harbor Plans Accordion
Priced plan rows compare at a glance and unfold their feature list on pick.
Live preview Accordions
Ivory Dot Accordion
A bare list where a small dot swells into an open ring beside the active row.
Live preview Accordions
Lattice Order Accordion
An order summary whose subtotal rows unroll with dotted leaders under a fixed total.
Live preview Accordions
Meadow Code Accordion
Each file row unrolls a numbered code block with tinted selectors and props.
Live preview Accordions
Nickel Switch Accordion
Every header carries a small metal switch that slides over as the row opens.
Live preview Accordions
Oasis Legend Accordion
Colour coded category groups where the open group borrows its own hue.
Live preview Accordions
Onyx FAQ Accordion
A quiet FAQ list whose plus sign rotates into a minus as the answer drops.
Live preview Accordions
Orbit Relief Accordion
Softly embossed panels sink into the surface the moment their section opens.
Live preview Accordions
Pearl Avatar Accordion
Each row opens with an initial badge that brightens as the message unfolds.
Live preview Accordions
Pylon Tasks Accordion
Project phases fold open onto tick boxes that strike their own task line through.
Live preview Accordions
Ratchet Fix Accordion
A troubleshooting tree where the yes and no answers open two different branches.
Live preview Accordions
Reef Percent Accordion
Each header carries a coverage percentage and a row of filled meter pips.
Live preview Accordions
Socket Permissions Accordion
Permission rows squash open from the top edge to explain why access is requested.
Live preview Accordions
Summit Thick Accordion
The open section thickens its outline while the padding shrinks to absorb it.
Live preview Accordions
Thicket Status Accordion
Pass, fail and pending markers are drawn in pure CSS beside each label.
Live preview Accordions
Valley Zebra Accordion
Alternating row tints keep a dense list readable while sections expand.
Live preview Accordions
Vault Deco Accordion
A gold framed panel with a deco ray fan that turns half around on selection.
Live preview Accordions
Verge Bellows Accordion
A ribbed bellows stretches between the header and the body as the fold expands.