loader

Simple Breadcrumbs

Html
<ol class="breadcrumb1">
	<li class="breadcrumb-item1 active">Home</li>
	<li class="breadcrumb-item1 active">About</li>
</ol>
<ol class="breadcrumb1">
	<li class="breadcrumb-item1"><a href="#">Home</a></li>
	<li class="breadcrumb-item1 active">Library</li>
</ol>
<ol class="breadcrumb1">
	<li class="breadcrumb-item1"><a href="#">Home</a></li>
	<li class="breadcrumb-item1"><a href="#">Library</a></li>
	<li class="breadcrumb-item1 active">Data</li>
</ol>

Color Breadcrumbs

Html
<ol class="breadcrumb1 bg-blue">
	<li class="breadcrumb-item1 active text-white">Home</li>
	<li class="breadcrumb-item1 active text-white">About</li>
</ol>
<ol class="breadcrumb1 bg-secondary">
	<li class="breadcrumb-item1"><a href="#" class="text-white">Home</a></li>
	<li class="breadcrumb-item1 active text-white">Library</li>
</ol>
<ol class="breadcrumb1 bg-success">
	<li class="breadcrumb-item1"><a href="#" class="text-white">Home</a></li>
	<li class="breadcrumb-item1"><a href="#" class="text-white">Library</a></li>
	<li class="breadcrumb-item1 active text-white">Data</li>
</ol>

Style Breadcrumbs

Html
<ol class="breadcrumb breadcrumb-arrow mt-3">
	<li><a href="#">Home</a></li>
	<li class="active"><span>Data</span></li>
</ol>
<ol class="breadcrumb breadcrumb-arrow mt-3">
	<li><a href="#">Home</a></li>
	<li><a href="#">Library</a></li>
	<li class="active"><span>Data</span></li>
</ol>
<ol class="breadcrumb breadcrumb-arrow mt-3">
	<li><a href="#">Home</a></li>
	<li><a href="#">Library</a></li>
	<li><a href="#">Elements</a></li>
	<li class="active"><span>Data</span></li>
</ol>

Svg Breadcrumb

Html
<ol class="breadcrumb border p-4 mb-4">
	<li class="breadcrumb-item"><a href="#" class="d-flex"><svg class="svg-icon" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3zm5 15h-2v-6H9v6H7v-7.81l5-4.5 5 4.5V18z"/><path d="M7 10.19V18h2v-6h6v6h2v-7.81l-5-4.5z" opacity=".3"/></svg><span class="breadcrumb-icon"> Home</span></a></li>
	<li class="breadcrumb-item active"><span>Data</span></li>
</ol>
<ol class="breadcrumb border p-4 mb-4 bg-light">
	<li class="breadcrumb-item"><a href="#" class="d-flex"><svg class="svg-icon" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3zm5 15h-2v-6H9v6H7v-7.81l5-4.5 5 4.5V18z"/><path d="M7 10.19V18h2v-6h6v6h2v-7.81l-5-4.5z" opacity=".3"/></svg><span class="breadcrumb-icon"> Home</span></a></li>
	<li class="breadcrumb-item"><a href="#">Library</a></li>
	<li class="breadcrumb-item active"><span>Data</span></li>
</ol>
<ol class="breadcrumb p-4 bg-primary br-3 overflow-hidden">
	<li class="breadcrumb-item text-white"><a href="#" class="d-flex text-white"><svg class="svg-icon" xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3zm5 15h-2v-6H9v6H7v-7.81l5-4.5 5 4.5V18z"/><path d="M7 10.19V18h2v-6h6v6h2v-7.81l-5-4.5z" opacity=".3"/></svg><span class="breadcrumb-icon"> Home</span></a></li>
	<li class="breadcrumb-item text-white"><a href="#" class="text-white">Library</a></li>
	<li class="breadcrumb-item text-white"><a href="#" class="text-white">Elements</a></li>
	<li class="breadcrumb-item active text-white"><span>Data</span></li>
</ol>