← All elements
<ol class="pc-steps" aria-label="Order progress">
<li class="is-done">Placed</li>
<li class="is-done">Packed</li>
<li class="is-current" aria-current="step">Shipped</li>
<li>Delivered</li>
</ol>About this navigation bar
An order-tracking stepper where list items and CSS counters draw numbered circles, finished steps turn into checkmarks and the current step pulses. Open an example, copy the HTML and the CSS, and paste them into your page. There is nothing to install and no JavaScript to load.