Collection of free Tailwind CSS dropdown components from Codepen and other resources.

Links
Made with
- HTML / CSS / JS
About a code
Tailwind CSS Dropdown
Use this dropdown component to show and hide a menu when clicking on any element using the data attributes from Flowbite.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: flowbite.js
Tailwind version: 2.2.4

Links
Made with
- HTML / CSS
About a code
Select Input
Simple but elegant UI.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.2.4

Links
Made with
- HTML / CSS / JS
About a code
Select Dropdown
Basic select with dropdown.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.2.4

Links
Made with
- HTML / CSS / JS
About a code
Animated Dropdowns
VueJS and custom CSS animations.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: vue.js
Tailwind version: 2.1.4

Links
Made with
- HTML / CSS
About a code
Pure CSS Dropdown using Focus-within (with Animation)
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.1.0

Links
Made with
- HTML / CSS / JS
About a code
User Dropdown With Icon + Profile Picture
Simple component user dropdown.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: alpine.js
Tailwind version: 2.0.2

Links
Made with
- HTML / CSS
About a code
Pure CSS Dropdown Menu
A CSS only based dropdown menu for "Sort By" selector.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.2

Links
Made with
- HTML / CSS / JS
About a code
Simple Dropdown
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.0+

Links
Made with
- HTML / CSS / JS
About a code
Dropdowns with Dividers
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.0+

Links
Made with
- HTML / CSS / JS
About a code
Dropdown Simple
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.0+

Links
Made with
- HTML / CSS
About a code
Multi Level Dropdown With Icons
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.0+

Links
Made with
- HTML / CSS
About a code
Dropdown with User Info
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.0+

Links
Made with
- HTML / CSS
About a code
Dropdown User Info with Icons
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.0+

Links
Made with
- HTML / CSS
About a code
Dropdown Notification
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 2.0.0+

Links
Made with
- HTML / CSS
About a code
Lo-fi Tailwind CSS Dropdown - With Icons
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 1.8.10

Links
Made with
- HTML / CSS
About a code
Lo-fi Tailwind CSS Dropdown - Icon Button
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 1.8.10

Links
Made with
- HTML / CSS
About a code
Lo-fi Tailwind CSS Dropdown - With Search
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 1.8.10

Links
Made with
- HTML / CSS
About a code
Lo-fi Tailwind CSS Dropdown - Basic
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Tailwind version: 1.8.10

Links
Made with
- HTML / CSS / JS
About a code
Simple Dropdown
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: alpine.js
Tailwind version: 1.7.0