Use our Tailwind CSS Breadcrumbs component to simply create beautiful Breadcrumbs for your pages with David UI.

See below our simple Breadcrumbs example that you can use in your Tailwind CSS and Angular project.

You first need to import the DUIBreadCrumb Module into your application module. 

    
 import { DUIBreadCrumb } from "david-ui-angular";
 
  @NgModule({
    declarations: [AppComponent],
    imports: [BrowserModule, DUIBreadCrumb],
    providers: [],
    bootstrap: [AppComponent],
  })
  export class AppModule {}
    
 
  <div class="w-80">
    <dui-breadcrumb>
      <ng-template breadcrumb-Item>
        <a href="#" class="opacity-60"> Docs </a>
      </ng-template>
      <ng-template breadcrumb-Item>
        <a href="#" class="opacity-60"> Components </a>
      </ng-template>
      <ng-template breadcrumb-Item>
        <a href="#">Breadcrumbs</a>
      </ng-template>
    </dui-breadcrumb>
  </div>