A menu in which options are hidden by default but can be shown by interacting with a button; it differs from a select in that it shows actions or navigation options and is not a form input.
Dropdown menu
Also known as: Select menu
46 Examples (46 shown)
Filter:
-   
 Ant Design
Tech
- React
 
Features
- Code examples
 - Accessibility issues
 - Open source
 
 -   
 Atlassian Design System
Tech
- React
 
Features
- Code examples
 - Usage guidelines
 - Tone of voice
 - Accessibility
 
 -   
 Blueprint
Tech
- React
 - Sass
 
Features
- Open source
 
 -   
 Bootstrap
Tech
- Sass
 
Features
- Code examples
 - Accessibility
 - Open source
 
 -   
 Bulma
Tech
- Sass
 
Features
- Code examples
 - Accessibility issues
 - Open source
 
 -   
 Carbon Design System
Tech
- React
 - Vanilla JS
 - Angular
 - Vue
 - Svelte
 - Web Components
 
Features
- Code examples
 - Usage guidelines
 - Open source
 
 -   
 Cauldron
Tech
- React
 - CSS
 
Features
- Code examples
 - Usage guidelines
 - Accessibility
 - Open source
 
 -   
 Clarity Design System
Tech
- CSS
 - Angular
 - Web Components
 
Features
- Code examples
 - Usage guidelines
 - Open source
 
 -   
 Coral
Tech
- React
 
Features
- Code examples
 - Tone of voice
 - Open source
 
 -   
 Crayons
Tech
- Web Components
 
Features
- Code examples
 - Open source
 
 -   
 Decathlon Design System
Tech
- CSS
 - React
 - Svelte
 - Vue
 - Web Components
 
Features
- Usage guidelines
 - Code examples
 - Accessibility
 - Open source
 
 -   
 Dell Design System
Tech
- Vanilla JS
 
Features
- Code examples
 - Usage guidelines
 
 -   
 eBay MIND Patterns
 -      
eBay MIND Patterns
 -   
 Elastic UI framework
Tech
- React
 - Sass
 
Features
- Code examples
 - Open source
 
 -   
 Evergreen
Tech
- React
 
Features
- Open source
 
 -   
 Flowbite
Tech
- Tailwind CSS
 
Features
- Open source
 - Code examples
 
 -   
 Fluent UI
Tech
- React
 - Web Components
 - Mobile
 
Features
- Usage guidelines
 - Code examples
 - Accessibility
 - Open source
 
 -   
 Fluent UI
Tech
- React
 - Web Components
 - Mobile
 
Features
- Usage guidelines
 - Code examples
 - Accessibility
 - Open source
 
 -   
 Forma 36
Tech
- React
 - CSS-in-JS
 
Features
- Code examples
 - Open source
 
 -   
 Geist Design System
Tech
- React
 
Features
- Code examples
 
 -   
 Gestalt
Tech
- React
 - CSS
 
Features
- Code examples
 - Open source
 - Usage guidelines
 
 -   
 Grommet
Tech
- React
 
Features
- Code examples
 - Open source
 
 -   
 Headless UI
Tech
- React
 - Vue
 
Features
- Code examples
 - Accessibility
 - Open source
 
 -   
 Helios
Tech
- Ember
 - Sass
 
Features
- Code examples
 - Usage guidelines
 - Accessibility
 - Open source
 
 -   
 HeroUI
Tech
- React
 - Tailwind CSS
 
Features
- Code examples
 - Open source
 
 -   
 Instructure-UI
Tech
- React
 - CSS-in-JS
 
Features
- Code examples
 - Accessibility
 - Open source
 
 -   
 Mozilla Protocol
Tech
- Handlebars
 - Sass
 
Features
- Usage guidelines
 - Open source
 
 -   
 Nessie
Tech
- Web Components
 - Tailwind CSS
 
Features
- Usage guidelines
 - Code examples
 
 -   
 Nord Design System
Tech
- Web Components
 
Features
- Code examples
 - Usage guidelines
 
 -   
 Pajamas
Tech
- Vue
 
Features
- Usage guidelines
 - Code examples
 - Open source
 
 -   
 Paste
Tech
- React
 - CSS-in-JS
 
Features
- Usage guidelines
 - Code examples
 - Tone of voice
 - Accessibility
 - Open source
 
 -   
 PatternFly
Tech
- React
 - Sass
 
Features
- Tone of voice
 - Open source
 - Usage guidelines
 
 -   
 Purple3
Tech
- CSS
 
Features
- Code examples
 - Unmaintained
 
 -   
 Quasar Framework
Tech
- Vue
 
Features
- Accessibility issues
 - Code examples
 - Open source
 
 -   
 Quasar Framework
Tech
- Vue
 
Features
- Accessibility issues
 - Code examples
 - Open source
 
 -   
 Radix Primitives
Tech
- React
 
Features
- Code examples
 - Open source
 
 -   
 Reach UI
Tech
- React
 
Features
- Accessibility
 - Code examples
 - Open source
 
 -   
 Reach UI
Tech
- React
 
Features
- Accessibility
 - Code examples
 - Open source
 
 -   
 Reakit
Tech
- React
 
Features
- Code examples
 - Open source
 - Accessibility
 
 -   
 Ruter Components
Tech
- React
 
Features
- Code examples
 - Unmaintained
 
 -   
 shadcn/ui
Tech
- React
 - Tailwind CSS
 
Features
- Code examples
 - Open source
 
 -   
 Shoelace
Tech
- Web Components
 
Features
- Code examples
 - Open source
 
 -   
 Source
Tech
- React
 
Features
- Code examples
 - Usage guidelines
 - Open source
 
 -   
 Visa Product Design System
Tech
- Angular
 - React
 - CSS
 - Mobile
 
Features
- Code examples
 - Usage guidelines
 - Accessibility
 - Open source
 
 -   
 Workday Canvas Design System
Tech
- React
 
Features
- Usage guidelines
 - Accessibility
 - Tone of voice
 - Open source
 
 
Related components
-  
Dropdown, Select input
A form input used for selecting a value: when collapsed it shows the currently selected option and when expanded, it shows a scrollable list of predefined options for the user to choose from.
 
Resources
-   
 By Adrian Roselli
 -   
 Open UI