Search field

Definition: A search field is a text input element that allows users to enter keywords or queries to search for specific information within the application.

When to use

Use a search field to facilitate the process of finding and retrieving relevant content or data. It's accompanied by a "Search" button or icon that users can click or tap to initiate the search. Users can enter search terms, such as keywords, phrases, or even complex queries, into the search field, and the system responds by presenting relevant results.

Anatomy

Icon

Inputs

Search field

Variations

Small & large format

Default search field

Primary search field

Search field with the default button

Search field with primary button

Action types

Field	Emphasis	Usage
1. Default	Medium	Use as a secondary action.
3. Primary	High	If users need to locate specific information from a larger dataset quickly. Using a larger variant is optional to enhance the visibility.

States

Enabled

Hover

Focused

Disabled

VUD Product Design System

VUD Product Design System is a collection of design assets, tokens, guidelines, code snippets and components that guarantees consistency and efficiency in the design and development process across enterprise software solutions.