Search field.
Accepts a query used to find matching content.
See it in context
What it is
A search field signals intent through its label, search icon, and optional clear action. Results may update while typing or after submission, but the behavior should be predictable.
When to use it
Keep the entered query visible and clearly communicate the current matching results.
Know the difference
Autocomplete helps complete an input value; search finds content that matches a query.
Across platforms
Web
Use a labeled native input and its appropriate type, inputmode, and autocomplete hints. Browser presentation and the available autofill UI vary.
iOS · iPadOS · Android
Choose the keyboard and content type for the value being entered. Keep the field visible above the on-screen keyboard and preserve the user’s selection.
macOS · Windows · Linux
Support ordinary keyboard editing, selection, paste, and undo. A desktop field should not depend on a touch-only accessory keyboard.
Go to the source
Primary documentation for the pattern and its platform conventions.