Live preview Alerts
Chalk Fade Alert
The status label cross fades from a saving state into a saved state and back.
#status CSS effects
18 free, pure-CSS effects match the "status" tag. Each is copy-ready and needs no library or build step.
Live preview Alerts
Cove Slim Alert
A very thin status bar with a colour cycling pip and a hairline that drains away.
Live preview Avatars
Pulse Status Line Avatar
The presence colour lives in the status sentence instead of on the avatar corner.
Live preview Badges
Status Dot Group
Three status pills sharing one shape, each with its own colour and dot glow.
Live preview Accordions
Thicket Status Accordion
Pass, fail and pending markers are drawn in pure CSS beside each label.
Live preview Alerts
Coral Top Icon Alert
A centred card whose flag icon drops in from above the title on every cycle.
Live preview Alerts
Summit Code Alert
A numeric status code stands beside the failure summary and flickers like bad neon.
Live preview Avatars
Delta Presence State Grid
Six avatars in a grid, each labelled with a different presence state colour.
Live preview Avatars
Garnet Signal Colour Rings
Three avatars whose ring colour alone encodes online, busy and away.
Live preview Avatars
Slate Presence Pulse Avatar
The green presence dot emits a soft ripple so the user reads as online.
Live preview Avatars
Valley Clickable Status Avatar
Clicking the avatar flips the presence label between available and do not disturb.
Live preview Marquees
Lattice Service Grid
Service names ride beside health dots, one of them blinking red for a fault.
Live preview Marquees
Rivet Flight Row
Flight numbers, routes and gate states cross the panel like an airport crawl.
Live preview Progress
Cove Status Progress
The status line and the bar share one timeline, so the label flips to complete as the fill lands.
Live preview Tables
Circuit Uptime Board
A service board where each row ends in a lit indicator and the failing one keeps ringing.
Live preview Tables
Jade Status Pills
Each row ends with a status pill and the live one keeps a soft pulsing dot.
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
Gasket Quality Gates
Each checkpoint drops a needle onto its tolerance band and one lands outside the green.