Live preview Timelines
Conduit Deploy Stages
Junction boxes sit on a twin conduit run and the stage in flight marches its stripes.
#list CSS effects
35 free, pure-CSS effects match the "list" tag. Each is copy-ready and needs no library or build step.
Live preview Timelines
Granite Branch Timeline
A granite commit trunk sprouts one side branch that curves out to its own node.
Live preview Timelines
Mica Growing Timeline
The mica rail redraws itself downward on a loop and each dot pops in behind it.
Live preview Alerts
Aurora List Alert
A blocking notice that enumerates three unmet conditions as staggered bullet rows.
Live preview Avatars
Prairie Vertical Member Column
Three members stacked in a column threaded by a single vertical guide line.
Live preview Avatars
Zenith Numbered Rank List
An ordered podium list where the first three places carry their own metal ring.
Live preview Modals
Bearing Timezone Modal
A timezone chooser unfurls sideways from a thin vertical line into a list of offsets.
Live preview Modals
Opal Scroll Modal
A pinned header sits above a scrollable list inside a compact opal dialog.
Live preview Marquees
Slate Vertical Feed
A stacked status list rolls upward forever inside a slate coloured window.
Live preview Marquees
Spiral Bullet List
A real list scrolls sideways and each square marker turns a quarter on every beat.
Live preview Marquees
Thicket Divider Run
Every item is closed by a thin upright rule, giving the run a printed masthead feel.
Live preview Progress
Topaz Skills Progress
A three row skill list where each label sits above its own topaz coloured meter.
Live preview Tabs
Delta Language Tabs
A language picker whose two letter code chip fills in as the greeting swaps below.
Live preview Tabs
Oasis Sort Filter Tabs
Sort chips with a turning arrow, reordering a short result list one row at a time.
Live preview Timelines
Amber Pulse Timeline
The step in progress throbs with an expanding amber halo while the rest stay dim.
Live preview Timelines
Basalt Checked Timeline
Finished basalt steps fill in with a tick while the connector to the last one stays dashed.
Live preview Timelines
Bearing Fault History
Each fault entry carries a split race ring and the open one turns the whole row red.
Live preview Timelines
Caliper Calibration Log
Calibration entries pin the measured value between two caliper jaws with the drift beside.
Live preview Timelines
Cascade Contract Stages
Signed contract stages get a tilted double ring stamp, the open one stays dashed.
Live preview Timelines
Cobalt Arrow Timeline
Cobalt chevrons point from one stage down to the next in place of a solid rail.
Live preview Timelines
Copper Badge Timeline
Every entry hangs off a copper pill badge that carries its month right on the rail.
Live preview Timelines
Coral Mirror Timeline
The coral rail sits on the right edge so the whole sequence reads right to left.
Live preview Timelines
Delta Hiring Pipeline
Hexagonal stage badges carry the funnel from applied down to a single offer.
Live preview Timelines
Dynamo Backup History
Snapshot cylinders chain downward with dashed links and the full run leads the set.
Live preview Timelines
Fjord Release History
Version tags with a notched left edge hang under every release headline.
Live preview Timelines
Frost Rail Timeline
A frosted vertical rail whose light drifts downward past three glowing event dots.
Live preview Timelines
Lever Time Card
A punched card lists the week where each row stamps its own in and out arrows.
Live preview Timelines
Mesa Year Bands
Year chips break the rail into bands so a long history stays readable.
Live preview Timelines
Onyx Ring Timeline
Hollow onyx rings mark every step and the running one spins a dashed halo.
Live preview Timelines
Ripple Pledge Timeline
Each funding tier sends a thin arc rippling outward from the left edge of the row.
Live preview Timelines
Ruby Numbered Timeline
Numbered ruby discs count the steps using a pure CSS counter, no markup digits.
Live preview Timelines
Savanna Gap Timeline
The space between two nodes grows with the wait, and the gap itself is labelled.
Live preview Timelines
Summit Recipe Steps
Recipe stages hang off a beaded rail and each one states its own cooking time.
Live preview Timelines
Topaz Gradient Timeline
A topaz to violet gradient runs down the rail and every dot borrows its local hue.
Live preview Timelines
Tundra Syllabus Steps
Course units read done, in progress and locked through three different markers.