ngx-admin/src/app/pages/ui-features/icons/icons.component.html

<div class="row">
  <div class="col-md-12 col-lg-6">
    <nb-card>
      <nb-card-header>
        Eva Icons
      </nb-card-header>
      <nb-card-body>
        <div class="icon" *ngFor="let icon of evaIcons">
          <i class="eva-icon-container" [nbPopover]="icon">
            <i [innerHTML]="icon | eva: { animationType: 'pulse' }"></i>
          </i>
        </div>
      </nb-card-body>
      <nb-card-footer>
        <a href="https://akveo.github.io/eva-icons/" target="_blank">See all Eva Icons</a>
      </nb-card-footer>
    </nb-card>
  </div>

  <div class="col-md-12 col-lg-6">
    <nb-card class="nb-icons">
      <nb-card-header>
        Nebular
      </nb-card-header>
      <nb-card-body>
        <div class="icon"
             *ngFor="let icon of icons.nebular">
          <i class="{{ icon }}" [nbPopover]="icon"></i>
        </div>
      </nb-card-body>
    </nb-card>

    <nb-card>
      <nb-card-header>
        Font awesome icons
      </nb-card-header>
      <nb-card-body>
        <div class="icon"
             *ngFor="let icon of icons.fontAwesome">
          <i class="{{ icon }}" [nbPopover]="icon"></i>
        </div>
      </nb-card-body>
      <nb-card-footer>
        <a href="http://fortawesome.github.io/Font-Awesome/icons/" target="_blank">
          See all Font Awesome icons
        </a>
      </nb-card-footer>
    </nb-card>

    <nb-card>
      <nb-card-header>
        Ionicons
      </nb-card-header>
      <nb-card-body>
        <div class="icon" *ngFor="let icon of icons.ionicons">
          <i class="{{ icon }}" [nbPopover]="icon"></i>
        </div>
      </nb-card-body>
      <nb-card-footer>
        <a href="http://ionicons.com/" target="_blank">See all ionicons</a>
      </nb-card-footer>
    </nb-card>

  </div>
</div>