Primitive
CLI registryScroll Progress
Reading-progress bar. Production mounts it fixed on the viewport; the preview tracks a local scroll container.
Preview → install → use
Preview
npx shadcn@latest add @atroui/scroll-progressScrollProgress
Scroll the panel - the brand bar tracks local progress.
Reading pane
Section 1. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 2. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 3. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 4. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 5. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 6. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 7. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 8. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 9. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 10. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 11. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Section 12. In production this mounts fixed at the top of the viewport and tracks document scroll. Here it uses containerRef so the preview is self-contained.
Source lands in your repo. Setup: Installation · Registry catalog.
Usage
API reference
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | - | Positioning + color classes (e.g. fixed, bg-brand). |
| containerRef | RefObject<HTMLDivElement> | - | Scroll container. Defaults to the document. |
| springOptions | SpringOptions | stiffness 200 | Motion spring for scaleX. |
Scroll Progress