Search Bars

A search bar allows people to search through a large collection of values by typing text into a field. A search bar can be displayed alone, or in a navigation bar or content view. When displayed in a navigation bar, a search bar can be pinned to the navigation bar so it's always accessible, or it can be collapsed until the user swipes down to reveal it.

Use a search bar instead of a text field to implement search. A text field doesn’t have the standard search bar appearance that people expect.

Enable the Clear button. Most search bars include a Clear button that erases the contents of the field.

Enable the Cancel button when appropriate. Most dedicated search bars include a Cancel button that immediately terminates the search.

Clear button

Cancel button

If necessary, provide hints and context in a search bar. A search bar's field can contain placeholder text—like “Search Clothing, Shoes and Accessories” or simply “Search”—as a reminder of the context being searched. A succinct, one-line prompt with appropriate punctuation can also appear directly above a search bar to provide guidance. Stocks uses a prompt to let people know they can enter a company name or stock symbol.

Placeholder text

Introductory text

Consider providing helpful shortcuts and other content below a search bar. Use the area under a search bar to help people get to content faster. Safari, for example, shows your bookmarks as soon as you tap the search field. Select one to go right to it without entering any search terms. Stocks shows a list of results as you type into the search field. Tap one at any time without typing any more characters.

For developer guidance, see UISearchController and UISearchBar.

Scope Bars

A scope bar can be added to a search bar to let people refine the scope of a search.

Favor improving search results over including a scope bar. A scope bar can be useful when there are clearly defined categories in which to search. However, it’s best to improve search results so scoping isn’t necessary.

For developer guidance, see UISearchBar.