Version 0.40.0

UI Atoms

Progress Bar

Native HTML Progress Bar (default)

<progress class="sui-a-progress-bar" role="progressbar" value="50" max="100"></progress>

Progress Bar size

<progress class="sui-a-progress-bar as--xs" role="progressbar" value="50" max="100"></progress>

<progress class="sui-a-progress-bar as--sm" role="progressbar" value="50" max="100"></progress>

<progress class="sui-a-progress-bar" role="progressbar" value="50" max="100"></progress>

<progress class="sui-a-progress-bar as--lg" role="progressbar" value="50" max="100"></progress>

Progress Bar status

<progress class="sui-a-progress-bar" role="progressbar" value="50" max="100"></progress>

<progress class="sui-a-progress-bar as--primary" role="progressbar" value="50" max="100"></progress>

<progress class="sui-a-progress-bar as--success" role="progressbar" value="50" max="100"></progress>

<progress class="sui-a-progress-bar as--warning" role="progressbar" value="50" max="100"></progress>

<progress class="sui-a-progress-bar as--danger" role="progressbar" value="50" max="100"></progress>