Live preview Sliders
Lattice Line Height
Ruled baseline guides sit behind a paragraph whose leading opens up while focus is inside.
Featured
Most popular CSS effects
The library's 10,238 effects, ordered by views. They are all pure CSS: copy, paste, and use them with no library or build step.
Live preview Sliders
Lever Loop Range
A bar waveform sits above a raked lever that picks how many bars the loop repeats for.
Live preview Sliders
Lull Halftone Slider
A print style dot screen fills the open rail and fades out across the plate above it.
Live preview Sliders
Marble Ring Slider
A hollow marble ring floats over a shallow channel and shows the rail through it.
Live preview Sliders
Mesa Endcap Slider
A small block and a large block bookend the rail to signal the minimum and maximum.
Live preview Sliders
Monsoon Notched Grip
Three cut notches score the grip while slanted rain streaks drift across the rail.
Live preview Sliders
Oasis Saturation Slider
A washed-out swatch strip floods back to full colour while the control is engaged.
Live preview Sliders
Obsidian Dual Range
Two stacked inputs share one rail so a min and a max handle bracket a span.
Live preview Sliders
Onyx Accent Slider
The native control kept intact and recoloured with a single accent-color line.
Live preview Sliders
Opal Bubble Slider
A pointed value bubble lifts above the rail whenever the control is touched.
Live preview Sliders
Orbit Neumorph Slider
A pale putty panel where a moon knob rides a pressed groove that fills in behind it.
Live preview Sliders
Pearl Volume Slider
A speaker glyph drawn in CSS sits beside the rail with a numeric readout.
Live preview Sliders
Piston Amp Panel
A gold amplifier faceplate with an engraved gain legend sitting above a woven speaker grille.
Live preview Sliders
Prairie Zone Slider
The rail is banded into low, mid and high zones with a matching legend underneath.
Live preview Sliders
Quiver Wave Slider
The rail is a chain of alternating arcs forming a sine wave that keeps drifting sideways.
Live preview Sliders
Ratchet Shift Selector
A machined gate slot with six detented positions and a weighted shift-knob handle.
Live preview Sliders
Reef Neomorphic Slider
A soft-UI control where the channel is pressed inward and the knob swells outward.
Live preview Sliders
Ridge Year Picker
A year selector stepping one year at a time above a ruled decade scale.
Live preview Sliders
Ripple Sketch Slider
A notebook doodle: wobbly ink border, a double pencil stroke rail and a hand drawn blob handle.
Live preview Sliders
Rivet Corner Radius
A riveted steel plate rounds all the way from a hard square into a full circle on hover.
Live preview Sliders
Ruby Heat Slider
A thermostat rail shifting from cold cyan to ruby heat with a scale beneath.
Live preview Sliders
Savanna Locked State
An enabled rail above a locked twin that drains its colour and dims its own label.
Live preview Sliders
Shaft Minute Timer
A ticking CSS clock face sits beside a rail that dials the countdown in five minute steps.
Live preview Sliders
Slate Pill Slider
A thick slate capsule rail where a violet fill tracks the pale pill handle.
Live preview Sliders
Socket Mute Volume
A checkbox mute key greys the whole rail out and swaps the readout for a muted badge.
Live preview Sliders
Spindle Axis Joystick
A crosshair gate pad reports the stick position while the rail trims the horizontal axis.
Live preview Sliders
Summit Brushed Rail
Fine vertical striations give the rail and the flat handle a brushed steel finish.
Live preview Sliders
Tether Trim Axis
A signed ruler runs from minus one hundred to plus one hundred with a bright zero detent.
Live preview Sliders
Thicket Header Slider
A tidy header line pins the field name left and its live value chip hard right.
Live preview Sliders
Tide Micro Slider
A compact inline chip barely taller than its label, sized for dense toolbars.
Live preview Sliders
Topaz Steps Slider
The rail is cut into five lit segments so every step lands on a visible block.
Live preview Sliders
Tundra Blur Preview
A frosted preview plate that sharpens the moment focus lands inside the control.
Live preview Sliders
Turbine Throttle Pair
A spinning hub sits beside stacked rails whose colour-coded handles trim top speed and acceleration.
Live preview Sliders
Valley Pastel Slider
A plum card carrying a mint to blush fill that follows a warm cream handle.
Live preview Sliders
Vault Pixel Slider
An eight bit console panel with a stepped pixel frame, blocky rail cells and a blinking caret.
Live preview Sliders
Wander Deco Slider
Gold hairlines rule a lacquered black plate with a faceted lozenge riding the gilt rail.
Live preview Sliders
Zenith Bauhaus Slider
Primary square, circle and wedge sit over a cream board with a bold two colour rail.
Live preview Tabs
Amber Segment Control
An iOS style segmented control with a springy amber thumb and scaling panels.
Live preview Tabs
Anvil Status Filter Tabs
Status filters with a heavy two pixel frame and no shadow, struck flat.
Live preview Tabs
Arc Vapor Tabs
A vaporwave grid horizon where the underline swings along a shallow arc, not a line.
Live preview Tabs
Basalt Icon Tabs
Icon only tabs cut from dark basalt with an ember bar riding the top edge.
Live preview Tabs
Bearing Difficulty Tabs
Difficulty tabs counted in bearing balls that seat themselves when chosen.
Live preview Tabs
Bloom Monochrome Tabs
Pure black and white with no colour at all; the active label gains weight and blooms.
Live preview Tabs
Canyon Month Tabs
Calendar month tabs painted in canyon strata, each opening its own week strip.
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
Chassis Density Tabs
Density tabs that stretch the same three rows instead of replacing them.
Live preview Tabs
Circuit View Switcher Tabs
Board style tabs that swap the panel between a list, a grid and a bar chart.
Live preview Tabs
Coil Carton Tabs
Corrugated cardboard tabs whose panel unrolls out of its own top left corner.
Live preview Tabs
Conduit Sort Direction Tabs
Two tabs flip one shared list end over end instead of swapping panels.
Live preview Tabs
Copper Badge Tabs
Each tab carries a count badge and the active one pulses in warm copper.
Live preview Tabs
Coral Icon Text Tabs
Icon and label together; the icon tilts and grows while an underline opens outward.
Live preview Tabs
Cove Peeking Carousel Tabs
Panels ride a horizontal track, the neighbours peeking dimmed at the edge of the frame.
Live preview Tabs
Cusp Cartoon Tabs
Thick outlined comic tabs that squash and spring back the moment they are picked.
Live preview Tabs
Dash Sketch Tabs
Hand drawn boxes on a notebook where a pencil dash is redrawn under the active tab.
Live preview Tabs
Delta Language Tabs
A language picker whose two letter code chip fills in as the greeting swaps below.
Live preview Tabs
Dune Right Aligned Tabs
Tabs pushed to the right of a titled bar, marked by a widening sand coloured rule.
Live preview Tabs
Dynamo Tracking Tabs
The active label spreads its letters apart while a charge line sweeps beneath it.
Live preview Tabs
Echo Pixel Tabs
An eight bit console strip where the marker jumps in visible pixel steps, never smoothly.
Live preview Tabs
Ember Subtitle Tabs
Every tab carries a small caption line that catches fire when the tab is chosen.
Live preview Tabs
Fjord Billing Period Tabs
A billing period switch with a sliding thumb, a saving badge and a swapping price.
Live preview Tabs
Flange Tier Tabs
Tier tabs where a bolted flange ring fills solid on the plan you open.
Live preview Tabs
Flux Holographic Tabs
An iridescent foil surface whose rainbow sheen keeps travelling over the chosen tab.
Live preview Tabs
Garnet Slide Tabs
Deep garnet chips select a panel that slides in from the right on every switch.
Live preview Tabs
Gasket Turning Panel Tabs
Panels seat themselves with a combined scale and rotation, like a gasket ring.
Live preview Tabs
Gear Payment Method Tabs
Payment method tabs where the cog of the chosen method keeps turning slowly.
Live preview Tabs
Girder Report Type Tabs
Report tabs sitting on a truss whose zigzag shifts under the active span.
Live preview Tabs
Glacier Package Manager Tabs
Install command tabs for three package managers with a cold monospace command line.
Live preview Tabs
Gleam Lacquer Tabs
Deep lacquered plates where a narrow specular highlight sweeps over the open tab.
Live preview Tabs
Glide Glass Tabs
A frosted glass pane stretches as it glides between the labels of the bar.
Live preview Tabs
Granite Gradient Tabs
The active tab fills with a granite gradient while the panel rail slides sideways.
Live preview Tabs
Halo Mist Tabs
A soft aura swells out of the chosen tab while the panel resolves out of a haze.
Live preview Tabs
Harbor Editor File Tabs
Editor style file tabs with a dirty dot and a close cross that appears on the active sheet.
Live preview Tabs
Hush Noir Tabs
Venetian blind shadows across a dark room, with one spotlight moving between the tabs.
Live preview Tabs
Ivory Progress Tabs
An ivory progress line under the panel grows as later tabs are selected.
Live preview Tabs
Jade Outline Tabs
Selecting a tab fires a jade ring that expands out of its rounded outline.
Live preview Tabs
Kiln Stacked Icon Tabs
Tabs stack a glyph over its label and the active glyph glows kiln orange.
Live preview Tabs
Kindle Riso Print Tabs
Two risograph ink layers start out of register and snap together on the chosen tab.
Live preview Tabs
Lagoon Side Rail Tabs
A vertical rail on the left points a small arrow into the wide panel it opened.
Live preview Tabs
Lapis Scale Tabs
A small dot marks the active tab and the panel scales up out of a blur.
Live preview Tabs
Lever Tilt Tabs
The chosen tab tips over its pivot and the panel swings in from the same hinge.
Live preview Tabs
Lull Origami Tabs
Folded paper facets where the panel drops open on a crease along its top edge.
Live preview Tabs
Meadow Thumbnail Tabs
Gallery thumbnails act as tabs and the full frame above cross fades with its caption.
Live preview Tabs
Mesa Right Side Tabs
The tab column sits on the right and a stone coloured rail rides down beside it.
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 Tabs
Obsidian Hover Tabs
Hovering previews a tab in indigo before the click; the panel rises from below.
Live preview Tabs
Onyx Folder Tabs
Browser style folder tabs whose active sheet merges into the panel below.
Live preview Tabs
Opal Thick Underline
A thick underline drifts between tabs while its opal gradient keeps shifting.
Live preview Tabs
Pearl Minimal Tabs
No chrome at all: the active label simply brightens and opens its letter spacing.
Live preview Tabs
Piston Time Range Tabs
Time range tabs whose piston head plunges down into the selected window.
Live preview Tabs
Prairie Growing Panel Tabs
The panel box grows or shrinks to the height each tab actually needs, in one motion.
Live preview Tabs
Pulse Brutalist Tabs
Heavy unrounded blocks with a hard offset shadow that springs into place on click.
Live preview Tabs
Quartz Vertical Tabs
A vertical tab column with a violet rail that travels along the right edge.
Live preview Tabs
Quiver Mosaic Tabs
Stained glass tabs over dark grout whose panel tiles light up one after another.
Live preview Tabs
Ratchet Account Type Tabs
A pawl steps across a toothed rack to pick between two account types.
Live preview Tabs
Reef Centered Pill Tabs
Centred pill tabs on an open bar; the active pill keeps breathing in coral light.
Live preview Tabs
Ripple Minimal Tabs
Hairline Japanese layout with wide breathing room where the labels answer in a wave.
Browse by category
ButtonsCardsLoadersTextBackgroundsCheckboxesTogglesHover EffectsBadgesFormsNavigationTooltipsAccordionsAlertsAvatarsModalsProgressSlidersTabsTablesTimelinesMarquees