Scroll Progress Components

Dev Design Library indexes 15 scroll progress components from 11 open-source UI libraries, with the most coming from Velora UI, Aceternity UI, UI Lab, Nexvyn UI and Rare UI. Each one links to its page with the source code, a live preview where available, the library license and the install command. Scroll progress components belong to the Feedback group.

• Scroll ProgressMagic UI · ReactAnimated Scroll Progress for your pages
• Scroll ProgressbeUI · ReactReading-progress indicator — fixed bar or circular ring — driven by scroll position via useSmoothScroll, with spring…
• Scroll ProgressRare UI · ReactA scroll progress pill that tracks reading position and expands into a squircle menu of sections you can jump to.
• Reading ProgressUser Interface Wiki · React
• Scroll ProgressAnimations (Svelte) · SvelteA fixed progress bar component that indicates page scroll progress with a gradient color effect.
• Chat MinimapNotra · ReactA rail of lines that maps a conversation, built on shadcn Button, Card, HoverCard and Tooltip.
• Scroll IndicatorNexvyn UI · ReactA vertical scroll progress indicator with tick marks, section labels, and a floating position readout.
• Reading ProgressUI Lab · ReactA progress bar fills as you read while the time left counts down.
• Reading trailCojeev UI · ReactKeep your place with a connected spine, an expandable bookmark or a descriptive chapter overview—all following actual…
• Scroll ProgressVelora UI · ReactGradient page-progress bar pinned to the top.
• TimelineAceternity UI · React
• Scroll SpineUI Lab · ReactMaps the article as a spine of bands, each as long as its section, filling in as you read.
• TimelineVelora UI · ReactVertical timeline with sticky labels and a gradient beam that fills as you scroll.
• Tracing BeamAceternity UI · React
• Tracing BeamVelora UI · ReactGradient line that draws itself down long-form content.

Libraries with scroll progress components

• Velora UI
• Aceternity UI
• UI Lab
• Nexvyn UI
• Rare UI

Related categories

• React Scroll Progress Components
• Tailwind CSS Scroll Progress Components
• Animated Scroll Progress Components
• Feedback Components
• Badge Components
• Spinner Components
• Progress Components
• Alert Components
• Chip Components
• Progress Bar Components
• Empty State Components
• Notification Components
• Status Indicator Components
• Skeleton Components
• Banner Components
• Typing Indicator Components
• Progress Circle Components
• Error State Components
• Success Animation Components