Animated Circular Progress Bar

Docs

Animated Circular Progress Bar is a component that displays a circular gauge with a percentage value.

Installation

npx shadcn@latest add "https://magicui.design/r/animated-circular-progress-bar"

Prop	Type	Description	Default
className	string	The class name to be applied to the component
max	number	The maximum value of the gauge	100
min	number	The minimum value of the gauge	0
value	number	The current value of the gauge	0
gaugePrimaryColor	string	The primary color of the gauge
gaugeSecondaryColor	string	The secondary color of the gauge

Contribute