Live preview Sliders
Chassis Steering Feel
A CSS steering wheel turns as the pointer arrives while the rail sets lock-to-lock travel.
#icon CSS effects
18 free, pure-CSS effects match the "icon" tag. Each is copy-ready and needs no library or build step.
Live preview Tabs
Aurora Bottom Dock Tabs
A mobile bottom navigation dock where the chosen icon lifts and glows aurora green.
Live preview Alerts
Brass Rail Alert
A riveted brass plate carries the icon beside a two line warning message.
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
Jade Check Alert
A success notice whose check orb beats gently inside an expanding halo ring.
Live preview Avatars
Mesa Letter To Icon Avatar
The monogram swaps for a drawn plus glyph so the tile doubles as an add action.
Live preview Marquees
Cobalt Icon Rail
Every item pairs a small rotated glyph with its label along a cobalt rail.
Live preview Sliders
Conduit Fuel Gauge
A fuel rail whose green fill buries the red reserve band as the tank climbs, with a range estimate above.
Live preview Sliders
Ember Spark Slider
The handle carries a spark glyph drawn from background bars and flickers as it burns.
Live preview Sliders
Fjord Zoom Control
A zoom rail flanked by minus and plus glyphs drawn purely from background bars.
Live preview Sliders
Glacier Speed Control
Playback speed between a single slow bar and a stack of accelerating speed lines.
Live preview Sliders
Pearl Volume Slider
A speaker glyph drawn in CSS sits beside the rail with a numeric readout.
Live preview Tabs
Basalt Icon Tabs
Icon only tabs cut from dark basalt with an ember bar riding the top edge.
Live preview Tabs
Cascade Icon Swap Tabs
Each tab flips its hollow icon over to a solid one the moment it becomes active.
Live preview Tabs
Coral Icon Text Tabs
Icon and label together; the icon tilts and grows while an underline opens outward.
Live preview Tabs
Gear Payment Method Tabs
Payment method tabs where the cog of the chosen method keeps turning slowly.
Live preview Tabs
Kiln Stacked Icon Tabs
Tabs stack a glyph over its label and the active glyph glows kiln orange.
Live preview Tabs
Turbine File Format Tabs
Export format tabs with a blade that spins up on the format you select.