Skip to main content Skip to navigation Skip to search

Progress Circle

Circular Progress

Circular Progress Properties

Name Type Description
status neutral | info | success | warning | danger
inverse boolean Inverts color of circular progress bar if `true`. Useful for displaying icons on a dark background.
value number Represents the percent completed from 0 to 100. If undefined, the progress-circle will be represented as an indeterminate progress indicator – a.k.a a "spinner".
line number Represents the thickness of the stroke of the circular progress. If undefined, it defaults to 3.
size string | sm | md | lg | xl | xxl

Circular Progress CSS Properties

Name
--ring-color
--ring-opacity
--fill-color