Menü
Use when implementing suggest options as users type.
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
Use when implementing help users understand their current location.
Use when implementing expand and collapse content sections.
Use when implementing user account configuration and preferences.
Use when implementing social activity and updates stream.
Use when implementing conversational AI chat interfaces.
Use when implementing handling AI-specific errors.
| name | autocomplete |
| description | Use when implementing suggest options as users type. |
| metadata | {"id":"autocomplete","category":"forms","pattern":"Autocomplete","source":"uxpatterns.dev","url":"https://uxpatterns.dev/patterns/forms/autocomplete","sourcePath":"apps/web/content/patterns/forms/autocomplete.mdx"} |
Suggest options as users type
Autocomplete helps users quickly find and select values from predefined options as they type. Autocomplete combines text input flexibility with dropdown-style selection, providing real-time suggestions matching user input. This pattern reduces errors, speeds data entry, and improves form completion.
references/pattern.md, then choose the smallest viable variation.role="combobox", aria-expanded, aria-controls).ArrowUp/ArrowDown, Enter, Escape, and Tab.aria-activedescendant and stable option IDs.For full implementation detail, examples, and testing notes, see references/pattern.md.
Pattern page: https://uxpatterns.dev/patterns/forms/autocomplete