Argon Dashboard Components

Discover 6 components available in Argon Dashboard

Sidebar Complex

Component from Argon Dashboard Builder
<div class="sidenav-header  align-items-center">
  <a class="navbar-brand" href="javascript:void(0)">
    <img src="https://demos.creative-tim.com/argon-dashboard/assets-old/img/brand/blue.png" class="navbar-brand-img" alt="...">
  </a>
</div>
<div class="navbar-inner">
  <div class="collapse navbar-collapse" id="sidenav-collapse-main">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link active" href="javascript:">
          <i class="fa fa-desktop text-primary"></i>
          <span class="nav-link-text">Dashboard</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="javascript:">
          <i class="fa fa-globe text-info"></i>
          <span class="nav-link-text">Icons</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="javascript:">
          <i class="fa fa-map-marker text-warning"></i>
          <span class="nav-link-text">Maps</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="javascript:">
          <i class="fa fa-table text-dark"></i>
          <span class="nav-link-text">Tables</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="javascript:">
          <i class="fa fa-lock text-danger"></i>
          <span class="nav-link-text">Login</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="javascript:">
          <i class="fa fa-key text-success"></i>
          <span class="nav-link-text">Register</span>
        </a>
      </li>
    </ul>
    <hr class="my-3">
    <h6 class="navbar-heading p-0 text-muted">
    <span class="docs-normal">Documentation</span>
    </h6>
    <ul class="navbar-nav mb-md-3">
    <li class="nav-item">
      <a class="nav-link" href="javascript:">
        <i class="fa fa-rocket"></i>
        <span class="nav-link-text">Getting started</span>
      </a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="javascript:">
        <i class="fa fa-palette"></i>
        <span class="nav-link-text">Foundation</span>
      </a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="javascript:">
        <i class="fa fa-chart-pie"></i>
        <span class="nav-link-text">Components</span>
      </a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="javascript:">
        <i class="fa fa-puzzle-piece"></i>
        <span class="nav-link-text">Plugins</span>
      </a>
    </li>
  </ul>
  </div>
</div>

Sidebar With Logo

Component from Argon Dashboard Builder
<div class="sidenav-header  align-items-center">
  <a class="navbar-brand" href="javascript:void(0)">
    <img src="https://demos.creative-tim.com/argon-dashboard/assets-old/img/brand/blue.png" class="navbar-brand-img" alt="...">
  </a>
</div>
<div class="navbar-inner">
  <div class="collapse navbar-collapse" id="sidenav-collapse-main">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link active" href="javascript:">
          <i class="fa fa-desktop text-primary"></i>
          <span class="nav-link-text">Dashboard</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="javascript:">
          <i class="fa fa-lock text-danger"></i>
          <span class="nav-link-text">Login</span>
        </a>
      </li>
    </ul>
  </div>
</div>

Sidebar Simple

Component from Argon Dashboard Builder
<div class="navbar-inner">
  <div class="collapse navbar-collapse" id="sidenav-collapse-main">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link active" href="javascript:">
          <i class="fa fa-desktop text-primary"></i>
          <span class="nav-link-text">Dashboard</span>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="javascript:">
          <i class="fa fa-lock text-danger"></i>
          <span class="nav-link-text">Login</span>
        </a>
      </li>
    </ul>
  </div>
</div>

Sidebar Profile

Component from Argon Dashboard Builder

Sidebar Rounded Icons

Component from Argon Dashboard Builder

Sidebar Documentation

Component from Argon Dashboard Builder