Animated Hamburger Menu Generator

Create stunning animated hamburger icon for Squarespace websites (7.1)

How to:

  1. Preview and choose the animation in the form below

  2. Customize the thickness of the icon

  3. Press copy button to save it into clipboard

  4. Insert the code snippet into Footer Injection

3Dx
3Dx Reverse
3Dy
3Dy Reverse
3Dxy
3Dxy Reverse
Arrow
Arrow Reverse
Arrow Alt
Arrow Alt Reserve
Arrow Turn
Arrow Turn Reverse
Boring
Collapse
Collapse Reverse
Elastic
Elastic Reverse
Emphatic
Emphatic Reverse
Minus
Slider
Slider Reverse
Spin
Spin Reverse
Spring
Spring Reverse
Stand
Stand Reverse
Squeeze
Vortex
Vortex Reverse

Preview

Beyondspace
<!-- sqs:beyondspace--animated-hamburger -->
<style id='bs-animated-hamburger'>
  @import url('https://cdn.jsdelivr.net/gh/BeyondspaceStudio/sqs-hamburgers@1.0.14/dist/hamburgers-slider.min.css');
  .header-burger-btn {
    --b-hamburger-layer-height: 2px;
  }
</style>
<!-- /sqs:beyondspace--animated-hamburger -->
Copy Code

Attribution:

Did the snippet works for you? Spread it with the world and earn discount!

Want more customizations?

Provided by Spark Plugin, these customizations can help make engaged mobile menu for your Squarespace website