Components

Search

The search bar helps users to find content by typing in words that describe the content they are looking for. This guide explains their usage.

Search
  • Usage
  • Examples
  • Related components
  • Download

Usage

The search bar is a simple search function with an input field and a placeholder text for users to type in their keyword(s). An auto-suggest function helps users find what they are looking for and act as a shortcut to the content they want.

Icon colors

There are two main colors that can be used for the icons inside the search bar: black and red. Feel free to use the one that better fits your interface.

Search field on white background with black icons.

Search field on a gradient background with red icons.

Examples

Related components

Download

Sketch UI Library
ZIP
85.97 MB