Skip to content
Forge

Search field with suggestions

A field offering suggestions as you type, navigable with the keyboard.

  • Tailwind
  • React
  • CSS
  • WordPress
Open in a new tab

Description

Implements the ARIA combobox pattern with a list of suggestions: arrows browse options, Enter selects, Escape closes, and the number of suggestions is announced. Matching ignores accents and case ("orleans" finds "Orléans"). Replace the city list with your own data.

Code

Loading the code…

Archive contents

champ-recherche-suggestions-html-tailwind.zip3 files · 4 Ko

  • index.html5 Ko
  • README.md2 Ko
  • LICENSE.md1 Ko

Tags

Updated on October 13, 2026.

In the same spirit

  • Slot booking

    Free

    An appointment form: reason, day with the native date picker, morning and afternoon slots as radio buttons, full slots crossed out and a summary of the choice.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component

  • File drop zone

    Coming soon

    An upload field that accepts drag and drop and lists the chosen files.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component

  • Preference switches

    Free

    A list of settings toggled with switches, each with a description.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component

  • Multi-step form

    Coming soon

    An appointment booking split into three steps, with a progress indicator.

    • Tailwind
    • React
    • CSS
    • WordPress
    Component
Search field with suggestions | Forge