Tabs

<ul class="nav nav-tabs lavalamp mb-2" id="myTab" role="tablist">
  <li class="nav-item">
    <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-selected="false">Contact</a>
  </li>
</ul>
<div class="tab-content" id="myTabContent">
  <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Velit doloremque accusantium quam iure qui itaque magnam omnis ex iste, explicabo nihil aspernatur delectus. Architecto illum vitae corporis soluta accusamus, expedita?</p>
  </div>
  <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet maxime tempore modi in sint, sapiente neque, aperiam ex illum perferendis reprehenderit labore atque corporis dolorum qui voluptas nihil deleniti expedita!</p>
  </div>
  <div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Velit doloremque accusantium quam iure qui itaque magnam omnis ex iste, explicabo nihil aspernatur delectus. Architecto illum vitae corporis soluta accusamus, expedita?</p>
  </div>
</div>

<ul class="nav nav-pills lavalamp mb-2" id="pills-tab" role="tablist">
  <li class="nav-item">
    <a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">Home</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">Profile</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#pills-contact" role="tab" aria-controls="pills-contact" aria-selected="false">Contact</a>
  </li>
</ul>
<div class="tab-content" id="pills-tabContent">
  <div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolor aliquid, magnam illo, consequatur atque sequi earum, non maxime unde beatae quos dicta exercitationem enim modi dolore! Voluptate eum, obcaecati dolorem!</p>
  </div>
  <div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rerum illo officia voluptate et nulla obcaecati cumque, aliquam, nesciunt eaque magnam adipisci enim at expedita. Rem natus, iusto doloribus ipsa sapiente.</p>
  </div>
  <div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores obcaecati doloribus ipsam. Omnis quam, nulla dolorem corporis culpa delectus maiores sint quasi incidunt deserunt modi impedit alias, quos sed molestias.</p>
  </div>
</div>