ProgressLinear

A linear progress indicator. It can display a specific value from 0 to 100 or showcase an indeterminate loading state.

Usage

Determinate Progress

Demonstrates progress value between 0 and 100.

<ProgressLinear value={50} height={2} />

Indeterminate Progress

Exhibits a looping animation indicating an ongoing process.

<ProgressLinear indeterminate height={2} />

Rounded Corners

A linear progress with rounded corners.

<ProgressLinear value={70} height={2} rounded />

API

Props

PropTypeDefaultRequired
valuenumber (0-100)0-
indeterminateboolean--
heightnumber4-
roundedboolean--
MarginPropsToken<MarginProps>--
colorThemeAccentColor--
radiusThemeRadius--
Progress Circular
Previous
Tab
Next