17 CSS Dropdown Menus

About the code

Molten Menu

This combines a CSS drop down menu, and the oozing effects of liquid flame.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -

About the code

HTML & CSS Dropdown Menu

Compatible browsers: Chrome, Firefox, Opera, Safari

Dependencies: -

About the code

Gradient Menu

Responsive gradient dropdown menu.

Compatible browsers: Chrome, Firefox, Opera, Safari

Dependencies: font-awesome.css

About the code

Main Menu

Horizontal menu with dropdown effects in HTML and CSS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: ionicons.css

About the code

CSS Menu

No JS - be sure to check out the mobile menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

CSS Dropdown Menu

HTML and CSS dropdown menu with nice effect.

Compatible browsers: Chrome, Firefox, Opera, Safari

Dependencies: -

About the code

Horizontal Dropdown Menu

Pure CSS horizontal dropdown menu with nice transitions and beautiful palette.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: ionicons.css

About the code

Dropdown Menu

Cool HTML & CSS dropdown menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: font-awesome.css

About the code

Fancy Menu

Fancy dropdown menu in HTML and CSS. Inspired by https://dribbble.com/shots/1075480-Ui-Kit-Hotel

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: font-awesome.css

About the code

Recursive Hover Navigation

Only CSS recursive hover nav.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

Cool Dropdown Menu Effects

Cool dropdown menu pure CSS effects.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

Dropdown Menu

Pure CSS dropdown menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

Simple Pure CSS Dropdown Menu

Menu with dropdown made only in CSS, with a line that follow the hover on the line.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

Simple Pure CSS Dropdown Menu

Simple, sleek looking dropdown menu effect achieved using pure CSS. Simple functionality, method can be extended to create a secondary dropdown block with few edits.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

Dropdown Menus

Animated CSS dropdown menus.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

Zigzag Dropdown Menu

This is just another dropdown menu concept.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

About the code

Responsive Menu

Simple, CSS only, responsive dropdown menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -