JSFiddle - React, Tailwind, and code Playground

HTML

<div class="st-level st-level-3"></div>

CSS

.st-level {
    background: repeating-linear-gradient(to left, #fff, #fff 2px, #C3C3C3 0, #C3C3C3 20%);
    height:8px;
    margin-right:-2px
}
.st-level:before {
    content:'';
    display: block;
    height:8px;
}
.st-level-1:before {
    width:20%;
    background: repeating-linear-gradient(to left, #fff, #fff 2px, #FF8400 0, #FF8400 100%);
}
.st-level-2:before {
    width:40%;
    background: repeating-linear-gradient(to left, #fff, #fff 2px, #FF8400 0, #FF8400 50%);
}
.st-level-3:before {
    width:60%;
    background: repeating-linear-gradient(to left, #fff, #fff 2px, #FF8400 0, #FF8400 33.3333%);
}
.st-level-4:before {
    width:80%;
    background: repeating-linear-gradient(to left, #fff, #fff 2px, #FF8400 0, #FF8400 25%);
}
.st-level-5:before {
    background: repeating-linear-gradient(to left, #fff, #fff 2px, #FF8400 0, #FF8400 20%);
}