A breadcrumb is a navigation aid that shows the user’s location within the hierarchy of a website or application.

Base Components


A breadcrumb is a navigation aid showing the user’s location within a website.

When should you use them?

Use breadcrumbs for websites or applications with deep hierarchies or multiple levels of content.

How should you use them?

  • Place breadcrumbs at the top of the page, below the header.
  • Use clear and concise labels for each level.
  • Ensure each breadcrumb is clickable, except for the current page.
  • Separate breadcrumb levels with a recognizable symbol, such as a greater-than sign ( > ).
  • Make sure breadcrumbs are responsive and adapt to different screen sizes.

No previous post
Up next

No next post