<hr>
.bg-* classes can be used on <hr> element. Click here to see the list of background colors.
<hr class="bg-black-09">
<hr class="bg-black-05">
<hr class="bg-black-03">
<hr class="bg-black-01">
The width can be set to 10px, 20px, 30px, 40px, 50px, 60px or 70px.
<div class="divider-width-10px"> <hr class="bg-black-05">
</div>
<div class="divider-width-20px"> <hr class="bg-black-05">
</div>
<div class="divider-width-30px"> <hr class="bg-black-05">
</div>
<div class="divider-width-40px"> <hr class="bg-black-05">
</div>
<div class="divider-width-50px"> <hr class="bg-black-05">
</div>
<div class="divider-width-60px"> <hr class="bg-black-05">
</div>
<div class="divider-width-70px"> <hr class="bg-black-05">
</div>
The height can be set to 1px, 2px or 3px.
<div class="divider-width-50px"> <hr class="bg-black-09">
</div>
<div class="divider-width-50px divider-height-2px"> <hr class="bg-black-09">
</div>
<div class="divider-width-50px divider-height-3px"> <hr class="bg-black-09">
</div>
Each <span> element appears as a dot. And .bg-* classes also can be used.
<div class="divider-dots divider-dots-sm"> <span class="bg-dark"></span> <span class="bg-dark"></span> <span class="bg-dark"></span>
</div>
<div class="divider-dots"> <span></span> <span></span> <span></span>
</div>
<div class="divider-dots divider-dots-lg"> <span class="bg-dark"></span> <span class="bg-dark"></span> <span class="bg-dark"></span>
</div>
<div class="divider-zigzag divider-zigzag-sm"> <span></span> <span></span> <span></span>
</div>
<div class="divider-zigzag"> <span></span> <span></span> <span></span>
</div>
<div class="divider-zigzag divider-zigzag-lg"> <span></span> <span></span> <span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-09"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-08"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-07"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-06"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-05"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-04"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-03"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-02"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-black-01"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-09"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-08"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-07"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-06"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-05"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-04"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-03"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-02"> <span></span><span></span><span></span>
</div>
<div class="divider-zigzag divider-zigzag-color-white-01"> <span></span><span></span><span></span>
</div>