Search boxes enable search functionality on a page and are typically used in a navigation bar.


The component expands to the full width of its container by default.

View examples of search box patterns

This component integrates with .p-navigation__nav for both small and large screens.

View examples of search box navigation patterns


For more information view the search design spec, which includes the specification in markdown format and a PNG image.

For more interactive information adding search view the navigation component.