The Search Input component lets users enter a search term and submit it using an adjacent button.

The component helps users find content, records, or results within a service such as by reference number, keyword, or name using a consistent, accessible search field.

Visually hidden label

Use a visually hidden label when the purpose of the search field is clear from the surrounding page context, such as in a dedicated search area or site header.

Search input with hint

Use hint text when users need additional guidance on what they can search for or how results will be matched.

When to use this component

Use the Search Input component when users need to submit a search query to find information within a service.

This includes:

• Searching lists or tables of records
• Finding items by reference number, keyword, or name
• Dedicated search pages or search sections within a page
• Filtering results where a submit action is required

The purpose of the component is to provide a standard search experience, including a labelled input, optional hint text, and a submit button so users can confidently search across ASP Digital services.

When not to use this component

Do not use the Search Input component for general text entry that is not a search action.

Use the Input component instead for standard form fields such as names, addresses, or reference numbers collected as part of a wider form.

Before using this component, consider:

• Whether the field is genuinely a search action rather than data entry
• Whether hint text is needed to explain what can be searched
• Whether the label can be visually hidden without losing context for screen reader users
• Whether validation or error messaging is required for empty or invalid searches

The Search Input component uses a full-width text field with an appended submit button. The input uses type="search" and follows ASP form styling to align with other form components across the design system.

Example of where we have used this component

This component is used on:

• VIM
• Action cards
• Tasks

This list is not exhaustive.

Status of development

The below criteria all need to be met for a component to be considered as fully developed for use within the ASP Digital Design System.