Skip to content
Home Theme Gallery

Progress

A track and an indicator whose width the server sets. The element carries the ARIA; the class only draws it.

Sixty-four per cent

The bar means nothing without role="progressbar", aria-valuenow, aria-valuemin, aria-valuemax and a name — colour and width are invisible to a screen reader. For work with no known end, use a spinner instead; there is no indeterminate mode.

.hui-progress

A progress bar. Set the width of the indicator.

<div class="hui-progress" role="progressbar" aria-valuenow="64" aria-valuemin="0" aria-valuemax="100">
<div class="hui-progress__indicator" style="width:64%"></div>
</div>

.hui-progress__indicator

The filled part of a progress bar.