Skip to content
Theme:

Ui3nProgress

Progress components for displaying loading and completion states.

Ui3nProgressLinear

Linear progress bar component.

Props

NameTypeDefaultDescription
valuestring | number | undefined0

Progress value

heightstring | number | undefined2

Progress height

withTextboolean | undefinedfalse

Whether to show text

bgColorstring | undefined"var(--color-bg-control-primary-default)"

Background color

colorstring | undefined"var(--color-bg-control-accent-default)"

Progress color

indeterminateboolean | undefinedfalse

Whether progress is indeterminate

Ui3nProgressCircular

Circular progress indicator component.

Props

NameTypeDefaultDescription
valuestring | number | undefined0

Progress value

sizestring | number | undefined64

Progress size

widthstring | number | undefined

Progress width

withTextboolean | undefinedfalse

Whether to show text

bgColorstring | undefined"var(--color-bg-control-primary-default)"

Background color

colorstring | undefined"var(--color-bg-control-accent-default)"

Progress color

indeterminateboolean | undefinedfalse

Whether progress is indeterminate

Usage Examples

Linear progress

Linear progress

Basic linear progress bar with value

30%

Linear progress indeterminate

Linear progress indeterminate

Indeterminate linear progress for unknown duration

Circular progress

Circular progress

Circular progress indicator with value

45%

Circular progress indeterminate

Circular progress indeterminate

Indeterminate circular progress for unknown duration