Scroll Rail — navigation.

An instrument-style chapter rail on the edge of a long page: a tick scale with a sprung progress needle, chapter marks whose labels spring out as you arrive, dock-style magnification on hover, and click or drag to scrub.

by vividsites StudioUICSSJSCut from Wetstreets

Use in Create

Installs: 3,076
Kind: UI · Navigation
Snippet: 324lines
Weight: 20.0KB
Dependencies: 0none
Added: 1 Oct 2026

vividsites.app/c/scroll-rail

Starting the preview…

The component’s own demo at 1280 × 800. Hover, click and scroll inside the frame.

Also from Wetstreets

More cut from Wetstreets, the site it came from.

Live

Rain Glass

Shader backgrounds · 3D

WebGL2
GLSL
JS

More navigation, same paste.

See all

Live

Breadcrumb Trail

Navigation · UI

Live

Capsule Nav

Navigation · UI

Live

Magnifying Dock

Navigation · UI

Live

Mega Menu

Navigation · UI