Tabs
Basic Tab
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Tab With Icon
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Basic Pill
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Pill With Icon
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus cumque corporis et hic obcaecati ipsum consequatur nostrum, explicabo praesentium saepe porro expedita iure suscipit harum illum quas esse quo fugiat vel temporibus ad ipsam! Laudantium asperiores ad at saepe illum.
Vertical Pill
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quaerat, quia sequi perferendis expedita iste eius unde doloribus rerum consectetur dicta? Quidem a quae hic nam enim at voluptates sint doloribus culpa, minima mollitia sapiente ipsa officiis totam voluptatum, aperiam eligendi reiciendis eaque, quibusdam tenetur recusandae quam facere necessitatibus est. Corrupti error ad corporis, culpa blanditiis similique dolore, adipisci ab natus voluptates repellat quaerat eos cum?
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quaerat, quia sequi perferendis expedita iste eius unde doloribus rerum consectetur dicta? Quidem a quae hic nam enim at voluptates sint doloribus culpa, minima mollitia sapiente ipsa officiis totam voluptatum, aperiam eligendi reiciendis eaque, quibusdam tenetur recusandae quam facere necessitatibus est. Corrupti error ad corporis, culpa blanditiis similique dolore, adipisci ab natus voluptates repellat quaerat eos cum?
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quaerat, quia sequi perferendis expedita iste eius unde doloribus rerum consectetur dicta? Quidem a quae hic nam enim at voluptates sint doloribus culpa, minima mollitia sapiente ipsa officiis totam voluptatum, aperiam eligendi reiciendis eaque, quibusdam tenetur recusandae quam facere necessitatibus est. Corrupti error ad corporis, culpa blanditiis similique dolore, adipisci ab natus voluptates repellat quaerat eos cum?
Vertical Pill With Icon
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quaerat, quia sequi perferendis expedita iste eius unde doloribus rerum consectetur dicta? Quidem a quae hic nam enim at voluptates sint doloribus culpa, minima mollitia sapiente ipsa officiis totam voluptatum, aperiam eligendi reiciendis eaque, quibusdam tenetur recusandae quam facere necessitatibus est. Corrupti error ad corporis, culpa blanditiis similique dolore, adipisci ab natus voluptates repellat quaerat eos cum?
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quaerat, quia sequi perferendis expedita iste eius unde doloribus rerum consectetur dicta? Quidem a quae hic nam enim at voluptates sint doloribus culpa, minima mollitia sapiente ipsa officiis totam voluptatum, aperiam eligendi reiciendis eaque, quibusdam tenetur recusandae quam facere necessitatibus est. Corrupti error ad corporis, culpa blanditiis similique dolore, adipisci ab natus voluptates repellat quaerat eos cum?
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quaerat, quia sequi perferendis expedita iste eius unde doloribus rerum consectetur dicta? Quidem a quae hic nam enim at voluptates sint doloribus culpa, minima mollitia sapiente ipsa officiis totam voluptatum, aperiam eligendi reiciendis eaque, quibusdam tenetur recusandae quam facere necessitatibus est. Corrupti error ad corporis, culpa blanditiis similique dolore, adipisci ab natus voluptates repellat quaerat eos cum?
How To Use
Basic Use HTML
<ul class="nav nav-tabs mb-3">
<li class="nav-item"><a class="nav-link active" data-bs-toggle="tab" href="#home">Home</a></li>
<li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#profile">Profile</a></li>
<li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#contact">Contact</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane fade show active" id="home">
<p>...</p>
</div>
<div class="tab-pane fade" id="profile">
<p>...</p>
</div>
<div class="tab-pane fade" id="contact">
<p>...</p>
</div>
</div>
For more Information please follow the Official Documentation