Combobox

Autocomplete input and command palette with a list of suggestions.

Preview Docs

Features

Searchable dropdown with real-time filtering

Keyboard navigation with arrow keys

Support for single and multi-select modes

Async data loading for large datasets

Custom rendering for options with icons or badges

Built-in empty state handling

Shadcn/ui Combobox - Figma Component

Autocomplete input and command palette with a list of suggestions. This Figma component is part of our comprehensive design system that brings the popular shadcn/ui library into your design workflow.

Every Combobox variant includes all the necessary states, properties, and styling options you need to create consistent, production-ready designs. The component seamlessly integrates with your existing Figma files and maintains full compatibility with the shadcn/ui React implementation.

Your questions, answered

Combobox for searchable lists

The shadcn/ui figma Combobox combines search and selection for large lists. Design country selectors, user directories, and searchable dropdowns in Figma where typing filters options instantly. This shadcn figma component supports async loading and multi-select.

Multi-select combobox design

Design multi-select comboboxes in Figma with the shadcn/ui figma component. Show selected items as tags or chips that users can remove. Perfect for designing tag inputs, category selectors, and multi-choice filters.

Combobox vs Select

Use the shadcn figma Combobox for searchable lists with many options and Select for smaller predefined lists. Design the right component in Figma for each use case—combobox for search, select for browsing.

Keyboard navigation in Figma

The shadcn/ui figma Combobox includes arrow key navigation, Enter to select, and Escape to close. Design accessible, keyboard-friendly interfaces in Figma that work perfectly when implemented with shadcn/ui.