GitHunt

Awesome React Navigation Bar

A modern application's navigation bar.

Purpose

To learn to build great navigation bars using tailwind with modern design patterns.

Used patterns:

  • Light / dark theme
  • Mega menu
  • K Bar

Demo

A live demo is available at https://awesome-react-navbar.web.app/

Screenshots:

  • Light theme:

light

  • Dark theme:

dark

Used technologies

  • ๐ŸŽ Repository: regular Git repository
  • ๐Ÿงฐ Frameworks: React, Typescript
  • ๐ŸŽจ Styling: tailwind

How to run

  1. Install Node.js.
  2. Install Yarn.
  3. Clone the repository.
  4. Type and run: yarn in the root directory.
  5. Type and run: yarn dev in the root directory.
  6. Open http://localhost:5173 in your browser to see the app.

Languages

TypeScript97.4%HTML1.0%CSS0.8%JavaScript0.8%

Contributors

Created February 19, 2023
Updated January 23, 2026
wojciechmarek/awesome-react-navbar | GitHunt