Edit these docs Rate these docs

Vue Bootstrap Breadcrumb

Vue Breadcrumbs - Bootstrap 4 & Material Design

Vue Bootstrap breadcrumbs indicate on which exact page in the navigational hierarchy your visitors currently are.

They are highly useful in projects, that tend to have a large structure like magazines or documentations.

Examples of Bootstrap breadcrumb use:

  • Documentation page
  • Magazine
  • ERP system

See the following breadcrumbs examples:

Basic breadcrumbs

              <mdb-breadcrumb-item active>Home</mdb-breadcrumb-item>
              <mdb-breadcrumb-item><a href="#">Home</a></mdb-breadcrumb-item>
              <mdb-breadcrumb-item active>Library</mdb-breadcrumb-item>
              <mdb-breadcrumb-item><a href="#">Home</a></mdb-breadcrumb-item>
              <mdb-breadcrumb-item><a href="#">Library</a></mdb-breadcrumb-item>
              <mdb-breadcrumb-item active>Data</mdb-breadcrumb-item>

          import { mdbBreadcrumb, mdbBreadcrumbItem } from 'mdbvue';
          export default {
            name: 'Breadcrumb',
            components: {

Install MDB CLI
It's the fastest way to create and host MDB projects
Free Download