ATOMS
ATOMS

Last updated: 18.03.2020

Version: 1.0

Breadcrumbs

The breadcrumb navigation is a secondary navigation on top of the page, below the main navigation. It also helps to give an orientation, by displaying an interactive path.

Breadcrumbs

Unrefactored
This component is only documented here but is not in a state to be used. Please feel free to refactor it first and document refactored version here before using it.

Fluid:

Responsive:

Currently, there is no dedicated component for breadcrumb. This is wrongly documented under atoms and should be documented as an organism when refactored
Sketch Component:
Organisms/Breadcrumb/Desktop

Usage

Breadcrumb navigation tells the user where the information architecture of a website is at the moment and can switch to a higher level if necessary. Every point of the breadcrumb navigation should be clickable.