Scroll To Top
A round scroll-to-top button that fades in past a scroll threshold, with a circular progress ring (DiceUI's circular-progress) tracing how far down the page you are. Tracks the window by default, or a specific scrollable element via the `container` prop.
Scroll this box
Line 1 — just filler content to make this box scrollable.
Line 2 — just filler content to make this box scrollable.
Line 3 — just filler content to make this box scrollable.
Line 4 — just filler content to make this box scrollable.
Line 5 — just filler content to make this box scrollable.
Line 6 — just filler content to make this box scrollable.
Line 7 — just filler content to make this box scrollable.
Line 8 — just filler content to make this box scrollable.
Line 9 — just filler content to make this box scrollable.
Line 10 — just filler content to make this box scrollable.
Line 11 — just filler content to make this box scrollable.
Line 12 — just filler content to make this box scrollable.
Line 13 — just filler content to make this box scrollable.
Line 14 — just filler content to make this box scrollable.
Line 15 — just filler content to make this box scrollable.
Line 16 — just filler content to make this box scrollable.
Line 17 — just filler content to make this box scrollable.
Line 18 — just filler content to make this box scrollable.
Line 19 — just filler content to make this box scrollable.
Line 20 — just filler content to make this box scrollable.
Scroll this box
Line 1 — just filler content to make this box scrollable.
Line 2 — just filler content to make this box scrollable.
Line 3 — just filler content to make this box scrollable.
Line 4 — just filler content to make this box scrollable.
Line 5 — just filler content to make this box scrollable.
Line 6 — just filler content to make this box scrollable.
Line 7 — just filler content to make this box scrollable.
Line 8 — just filler content to make this box scrollable.
Line 9 — just filler content to make this box scrollable.
Line 10 — just filler content to make this box scrollable.
Line 11 — just filler content to make this box scrollable.
Line 12 — just filler content to make this box scrollable.
Line 13 — just filler content to make this box scrollable.
Line 14 — just filler content to make this box scrollable.
Line 15 — just filler content to make this box scrollable.
Line 16 — just filler content to make this box scrollable.
Line 17 — just filler content to make this box scrollable.
Line 18 — just filler content to make this box scrollable.
Line 19 — just filler content to make this box scrollable.
Line 20 — just filler content to make this box scrollable.
npx shadcn add @ectopcoi-components/scroll-to-top