Angular Navs

Our Angular Navs component allows to create simple navigation. Navigation available in Angular shares general markup and styles, from the base .nav class to the active and disabled states.
Learn how to use Angular navigation from this documentation and navs examples to quickly and easily create elegant and flexible navs.


<tabset type="pills" class="nav-fill no-tab-content">
  <tab heading="UI/UX Design"></tab>
  <tab heading="Programming"></tab>
  <tab heading="Graphic"></tab>
</tabset>

Circled nav pills

<tabset type="pills" class="nav-pills-circle no-tab-content">
  <tab>
    <ng-template tabHeading>
      <span class="nav-link-icon d-block"><i class="ni ni-atom"></i></span>
    </ng-template>
  </tab>
  <tab>
    <ng-template tabHeading>
      <span class="nav-link-icon d-block"><i class="ni ni-chat-round"></i></span>
    </ng-template>
  </tab>
  <tab>
    <ng-template tabHeading>
      <span class="nav-link-icon d-block"><i class="ni ni-cloud-download-95"></i></span>
    </ng-template>
  </tab>
</tabset>

Tabs

Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth.

Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse.

Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui.

Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth.

<tabset type="pills" class="nav-fill flex-column flex-md-row">
  <tab>
    <ng-template tabHeading>
      <i class="ni ni-cloud-upload-96 mr-2"></i>Home
    </ng-template>
    <p class="description">Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth.</p>
    <p class="description">Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse.</p>
  </tab>
  <tab>
    <ng-template tabHeading>
      <i class="ni ni-bell-55 mr-2"></i>Profile
    </ng-template>
      <p class="description">Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui.</p>
  </tab>
  <tab>
    <ng-template tabHeading>
      <i class="ni ni-calendar-grid-58 mr-2"></i>Messages
    </ng-template>
    <p class="description">Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth.</p>
  </tab>
</tabset>