Accessible Dropdown
An accessible dropdown component that provides keyboard navigation, proper ARIA attributes, and screen reader support. Users can select from a list of options that appears when triggered, with customizable behavior for selection, events, and responsive design.
Non automatic selection
The dropdown will not automatically select an item.
Choose an element
- Book
- Movies
- Music
- Video games
- Paint
Automatic first item selected
The dropdown will automatically select the first item.
Choose an element
- Book
- Movies
- Music
- Video games
- Paint
Automatic specific item selected
The dropdown will automatically select a specific item.
Choose an element
- Book
- Movies
- Music
- Video games
- Paint
With events
The dropdown will trigger events when it is opened, closed, or when an item is selected.
Choose an element
- Book
- Movies
- Music
- Video games
- Paint
Dropdown only for < 1024px devices
The dropdown will only be visible on devices with a width of less than 1024px.
Choose an element
- Book
- Movies
- Music
- Video games
- Paint
With action buttons
The dropdown will have action buttons to add and remove items.
Choose an element
- Book
- Movies
- Music
- Video games
- Paint
Dropdown closed on focus out
The dropdown will be closed when the button is focused out.
Choose an element
- Book
- Movies
- Music
- Video games
- Paint