Patterns · Choosing / Search as you type

Search as you type

Matches appear under the field as people type, with the match in bold.

How it works

1
closeTitle
petsSpecies
Typed text
Match one (Scientific name)
Match two (Scientific name)
Match three (Scientific name)

Up to five matches drop under the field.

2
closeTitle
petsSpecies
Chosen value
infoFilled from the parents. You can change it.

When the system already knows the answer, it fills the field and says where it came from.

Rules

  • Matches start after two characters.
  • The typed part is bold; the scientific name follows in brackets.
  • A filled-in value always says where it came from and stays editable.
  • No match: one line, "No match. Check the spelling."

Motion and haptics

MomentMotionHaptic
Match chosenList closes 150 msLight tick

Seen in

EggHome

Built from the Antz modules on the Design Links hub, 26 Oct 2026. Not drawn in Figma yet: treat it as a temporary rule.