Skip to content
Patternfly Logo


A breadcrumb provides page context to help users navigate more efficiently and understand where they are in the application hierarchy.

Most frequently, breadcrumb consists of many links which will use Tab to navigate through them, Shift + Tab to go backwards, and Enter to activate each link.

In general, the breadcrumb component already has accessibility built in. However, if you would like to customize it, edit the following:

React component
Prop or attribute
Which HTML element it appears on in markup
Label added to the breadcrumb nav

View source on GitHub