Element live demo

Code used to include the process arrow:

<!-- in head -->
<link rel="import" href="process-arrow.html">

<!-- in body -->
<process-arrow
  selected="3">
  <span>Baby</span>
  <span>Child</span>
  <span>Teenager</span>
  <span>Working-class hero</span>
  <span>Retired</span>
</process-arrow>

Unstyled

Styled

You can edit the styles here, they are reflected in the element below. ♥

process-arrow.styled {
color: #663399;
height: 2.5rem;
font-family: "Arial", sans-serif;
font-weight: bold;
text-transform: uppercase;
text-align: center;

}