Shadcn.io is not affiliated with official shadcn/ui
Info
A blue info-colored progress bar using custom Tailwind classes for informational or neutral state indication at 60 percent
Blue means information—calm and neutral. This React Progress component uses blue colors (bg-blue-500 indicator, bg-blue-500/20 track) to indicate informational or neutral states at 60 percent. Built with shadcn/ui Progress and Radix UI primitives with Tailwind overrides, blue communicates non-urgent information states—perfect for data syncing, routine processing, background tasks, informational updates, or any progress where color signals normal operations without urgency or concern.
Info preview
Installation
Related Components
Success Progress
Green success state progress
Warning Progress
Yellow warning state progress
Empty Progress
Default neutral progress
Badge
Info badges with colors
Info Alert
Informational notification
Gradient Progress
Multi-color gradient progress
FAQ
Was this page helpful?
Sign in to leave feedback.