Small progress.
For AI Agents
Hand your agent this brief or the ReUI MCP, not a screenshot. Free to install.
Best for: A slim bar pinned to a 4px track, whatever height the active style gives it by default
When to use
- Labeled bars that report how far an upload, a download or a workspace setup has got, as a percent
- File transfer rows with time left, and setup checklists whose bar counts the steps done
- Compact bars in dense list rows, and bars pinned to a set height or filled in a color of their own
When not to use
- A drop zone or picker where people choose the documents and images to send: use the File Upload component
- Numbered steps the user can open or move between, each with its own panel: use the Stepper component
- A wait of unknown length, where no share of the work done can be shown: use the Spinner component
Agent notes
ProgressLabelandProgressValueexist in the base twin only; radixProgressdrops its children, so print the label and percent beside it- Set bar height on the
progress-trackslot in base, asc-progress-2does, and with a height class onProgressin radix, whose root is the track - Only a base
ProgressLabelnames the bar for screen readers; give every other bar, radix ones included, an aria-label naming the task
https://reui.io/components/progress/c-progress-2.mdget_example("c-progress-2")npx shadcn@latest add @reui/c-progress-2Shadcn Components in Progress Small
About Shadcn Progress Small
Small progress. Built with the Progress component. A free, open source shadcn progress example you can install with npx shadcn@latest add @reui/c-progress-2 and edit as your own code.
What You Can Build With Shadcn Progress Small
- Composes Progress, so it drops into any project already using those components.
- Install it with the shadcn CLI: npx shadcn@latest add @reui/c-progress-2
- Open source and free, with the full source on this page to copy or adapt.
More Shadcn Progress Examples
- Basic Basic progress.
- Large Large progress.
- Status Messages Progress bar with status messages.
- File Uploads File upload list with progress & status.
- With Slider Progress bar with slider.
- Multi-Step Multi-step progress indicator
- Custom Colors Progress bar with custom colors.
Related Shadcn Component Categories
Open-source shadcn questionnaire components for onboarding surveys, multi-step question flows, and guided feedback.
Open-source shadcn radio group components for single-choice forms, plan selection, and settings preferences.
Open-source shadcn rating components for product reviews, feedback forms, and satisfaction scores.
Open-source shadcn resizable components for split panes, workspace layouts, and draggable dividers.
Open-source shadcn scroll area components for custom scroll regions, sidebar panes, and dense lists.
Open-source shadcn scrollspy components for docs navigation, active table of contents, and long-form sections.
Frequently Asked Questions
When should I use Shadcn Progress Small?
Use it for a slim bar pinned to a 4px track, whatever height the active style gives it by default.
Shadcn Progress as a whole fits:
- Labeled bars that report how far an upload, a download or a workspace setup has got, as a percent
- File transfer rows with time left, and setup checklists whose bar counts the steps done
- Compact bars in dense list rows, and bars pinned to a set height or filled in a color of their own
For a drop zone or picker where people choose the documents and images to send, use the File Upload component. For numbered steps the user can open or move between, each with its own panel, use the Stepper component. For a wait of unknown length, where no share of the work done can be shown, use the Spinner component.
How do I install Shadcn Progress Small?
Is Shadcn Progress Small free to use?
Which components does Shadcn Progress Small use?
Start building with ReUI Pro today.
Every Pro block, every style, and every future addition, with one license for unlimited projects.
From $249, once. Lifetime updates.