39 CSS Hamburger Menu Icons

Free HTML and CSS hamburger menu icons. Update of May 2018 collection. 12 new items.

Related Articles

1. CSS Dotted Menu Icons

About the code

Hamburger Menu Button Interaction

Hamburger menu button interaction in pure CSS.

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

Responsive: yes

Dependencies: -

About the code

Hamburger Animation

Hamburger/Close icon transition.

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

Responsive: yes

Dependencies: -

About the code

Click Highlighter on Menu Button Using :after

Using an :after pseudo element on a menu button, we can achieve a click highlighter effect. Similar to that of Google's Material Design.

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

Responsive: yes

Dependencies: -

About the code

Hamburger Menu

Simple hamburger menu icon with little jQuery.

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

Responsive: yes

Dependencies: jquery.js

About the code

Hamburger Menus

Menu CSS only effects.

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

Responsive: yes

Dependencies: svd-full.css

About the code

Flipping Burgers

A set of hamburger menu open/close animations in SVG, HTML and CSS.

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

Responsive: yes

Dependencies: -

About the code

CSS Hamburger Menus

Hamburger menu animations, all with pure CSS.

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

Responsive: yes

Dependencies: -

About the code

Hamburger Menu Animations

Four different menu animations for menu button toggle between hamburger, cross and back icon.

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

Responsive: yes

Dependencies: -

About the code

Button Navigation

Animated button nav (single element with drawing style) by using CSS & JavaScript.

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

Responsive: yes

Dependencies: -

About the code

Menu Icon with a Spin

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

Responsive: yes

Dependencies: -

About the code

Hamburger Icon with Checkboxes

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

Responsive: yes

Dependencies: -

About the code

Hamburger Menu

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

Responsive: yes

Dependencies: -

About the code

Hamburger Icons Animations

CSS hamburger icons with great hover states and animations.

About the code

Flipping Menu Toggle

What the flip is this? Not ideal for production but here's a fun menu toggle experiment with CSS animations.

About the code

Cool Hamburger Toggle Effect

Creative hamburger toggle effect.

About the code

Hamburger Button

Sexy hamburger button.

About the code

Hamburger Open Animation

HTML, CSS and JS hamburger open animation.

About the code

SVG Menu Animation

Hamburger menu animtion with svg element.

About the code

Hamburger Icon Animation

Simple CSS hamburger icon animation with little jQuery.

About the code

Menu Animation

Hamburger menu animation.

About the code

Hamburger Menu Button

HTML, CSS and JavaScript hamburger menu button.

About the code

3D Hamburger Transformicon

3D hamburger transformation with HTML, CSS and JS.

Click Me! Hamburger Menu

Original shot dribbble.com/shots/33231…
Made by Alexandr Izumenko
March 2, 2017

About the code

Half Second Hamburger Helper

A showcase of hamburger menus.

Hamburger Icon Animations

12 hamburger icon animations.
Made by Rosa
November 6, 2016

Atomic Hamburger Menu CSS

HTML and CSS atomic hamburger menu.
Made by Alex Coven
October 10, 2016

Hamburger Icon Animations

Hamburger icon animations in HTML, CSS and JavaScript.
Made by Carlos
August 13, 2016

Animated Burger/Menu Icon

HTML, CSS and JavaScript animated burger/menu icon.
Made by Nicholas M. Smith
July 31, 2016

Hamburger Menu Elastic

Hamburger menu elastic with HTML, CSS and JavaScript.
Made by Davide Cantelli
July 6, 2016

20 Menu Buttons To Hamburger

Menu button to hamburger. Styled & animated with pure CSS.
Made by Yinxi Chen
June 5, 2016

Animated Menu Icon

Animated menu icon toggling between hamburger for open and X for exit.
Made by Eric Grucza
May 27, 2016

Simple Navbar Toggle To X (Vanilla JS)

A simple CSS and JS solution to make a standard Navbar “hamburger” into an X on click, and then back to a hamburger when clicked. Requires no dependencies, written with vanilla JS.
Made by Joseph Gengarella
April 3, 2016

Menu Icon Animation

Menu icon animation with HTML, CSS and JavaScript.
Made by Marius Balaj
March 23, 2016

About the code

Hamburger Icon Animation To Cross Underline With CSS

"We animate the hamburger icon, which gives access to the responsive menu using transformations and CSS pseudo elements along with HTML, and turning the element into a new menu close icon that improves the UX in case the user wants to return to the previous view." - Ricardo Prieto

CSS(SASS) Hamburger Menu Animation

A small hover animation on a hamburger menu icon.
Made by Derek Morash
January 11, 2016

SVG Menu Icon

Codrops SVG menu icon with popmotion.
Made by Popmotion
November 12, 2015

Expanding Hamburger Navigation Icon

Expanding hamburger menu that displays the intent of the button more clearly than a typical hamburger menu icon.
Made by Ryan Canfield
May 11, 2015

Hamburger Menu Animation

Just another hamburger menu animation.
Made by Sebastian Popp
April 2, 2015

Drawn Hamburger Transition

More fun with hamburger icon transitions.
Made by Jesse Couch
September 4, 2014