Home Components Colors Typography Blog Blocks
Peacock Home Components Colors Typography Blog Blocks Direction Theme

Linear Progress

A linear progress indicator is a visual representation of progress toward a specific goal.

Usage


  <wc-linear-progress value="40" label="Progress" helper-text="Optional helper text goes here..."></wc-linear-progress>

    <wc-linear-progress label="Indeterminate" indeterminate="true"></wc-linear-progress>

  <wc-linear-progress label="Inline" helper-text="Optional helper text goes here..." inline="true"></wc-linear-progress>

Sizes

Fancy larger or smaller spinners? Add size attribute for additional sizes.


  <wc-linear-progress value="60" style="--progress-height: 8px"></wc-linear-progress>
On this page

Linear Progress

Sponsor