Awesome Open Source
Awesome Open Source

React Hamburger Icon

NPM License

A featherweight animated 'hamburger' menu icon for React. Highly configurable and stylable, with sensible defaults.

Installation

npm i react-hamburger-icon

Usage

Import the component and use it anywhere you want a hamburger icon. Pass an open prop to determine whether it shows an open state. You can configure it with animation, lineWidth, and duoLine props, as well as style things like size and color directly on the component.

See the API Docs for a full overview of props and options.

import React, { useState } from 'react';
import { HamburgerIcon } from 'react-hamburger-icon';

export function Menu() {
  const [open, setOpen] = useState(false);

  return <HamburgerIcon open={open} onClick={() => setOpen(!open)} />;
}

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
React Components (2,361
Icons (1,902
Related Projects