Collection of hand-picked free HTML and CSS dotted menu icon code examples from codepen and other resources. Update of January 2020 collection. 4 new items.

Related Articles

  1. CSS Icons and Icon Sets
  2. CSS Hamburger Menu Icons
  3. CSS Social Media Icons
  4. CSS Weather Icons

Author

  • LotCSSCom

Links

Made with

  • HTML (Pug) / CSS (SCSS)

About a code

CSS More Menu Icon Animation

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

Responsive: yes

Dependencies: simple-line-icons.css

Author

  • El Alemaño

Links

Made with

  • HTML (Haml) / CSS (SCSS)

About a code

More Button Animation

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

Responsive: yes

Dependencies: -

Author

  • Aske

Links

Made with

  • HTML / CSS (SCSS)

About the code

Animated Menu Icon

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

Responsive: no

Dependencies: -

Author

  • istef

Links

Made with

  • HTML (Pug) / CSS (SCSS)

About the code

CSS Menu Icon Animation

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

Responsive: no

Dependencies: -

Demo image: Dot Menu Dot Menu - GIF Demo

Author

  • @Grienauer

Links

Made with

  • HTML / CSS (SCSS)

About the code

Dot Menu

Three dot CSS only menu animation.

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

Dependencies: -

Demo image: Dots Menu Icon Dots Menu Icon - GIF Demo

Author

  • Alex

Links

Made with

  • HTML / CSS (SCSS) / JavaScript

About the code

Dots Menu Icon

Dots menu icon in HTML, CSS and JS.

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

Dependencies: -

Demo image: Dotted Menu Pure CSS Dotted Menu Pure CSS - GIF Demo

Author

  • Izzy Skye

Links

Made with

  • HTML / CSS (SCSS)

About the code

Dotted Menu Pure CSS

A quick and easy dotted menu icon done in pure CSS in a single element.

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

Dependencies: -

Demo image: Dotted Menu Concept Dotted Menu Concept - GIF Demo

Author

  • Kyle Brumm

Links

Made with

  • HTML / CSS (SCSS) / JavaScript

About the code

Dotted Menu Concept

Just messing around with creating a new menu icon concept.

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

Dependencies: -

Author

  • Kevin

Links

Made with

  • HTML / CSS (SCSS)

About a code

Toggle Menu

Animated toggle menu.

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

Responsive: yes

Dependencies: -

Author

  • Alex Coven

Links

Made with

  • HTML / CSS

About a code

Material More Button CSS

More info button with Material Design style. Used input:checked and a checkbox to build this, then used a tags to protect the click from unchecking the checkbox.

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

Responsive: yes

Dependencies: -

Demo image: Three Dots Menu Animation Three Dots Menu Animation - GIF Demo

Author

  • Sébastien JEAN

Links

Made with

  • HTML / CSS

About the code

Three Dots Menu Animation

Three dots menu animation on hover.

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

Dependencies: -