Search enables users to specify a word or a phrase to find relevant pieces of content without the use of navigation. Search can be used as the primary means of discovering content, or as a filter to aid the user in finding content.
|Large search||This should be used at a global level when the user is searching content within a page view.|
|Small search||Choose small when there are space constraints in your design. It can also be component-specific. For example, small search can be used to filter data within a data table.|
Set the user’s context for the search with helpful placeholder text within the search field (search documents), that pertains to the page or section the search box is in. Search in the global header should just say search.
Accessibility note: If the search component’s label and placeholder text differ, VoiceOver on macOS will read both.