Components

Breadcrumbs

Breadcrumbs indicate the current page’s location within a hierarchy and where the user is in relation to the rest of that hierarchy. They also afford one-click access to higher levels of that hierarchy.

Created with Sketch. Home Sub Page Level 1 Sub Page Level 2 Current Page
Detail Page Section Configurator Copy 
.breadcrumb {
font-family: Lato-Regular;
font-size: 14px;
line-height: 44px;
}

.breadcrumb .breadcrumb-active {
color: #0074D9;
}

.breadcrumb .breadcrumb-active:hover {
color: #3C4144;
}

.breadcrumb .breadcrumb-current {
color: #3C4144;
}

Overview of CSS Classes

Selector
Summary
Parent Selector

.breadcrumb

.breadcrumb-active

.breadcrumb-current