Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/justalever/tailwindcss-mega-menu

A guide on how to create a mega menu with Tailwind CSS in 2022
https://github.com/justalever/tailwindcss-mega-menu

html megamenu stripe tailwind tailwindcss

Last synced: 2 months ago
JSON representation

A guide on how to create a mega menu with Tailwind CSS in 2022

Host: GitHub
URL: https://github.com/justalever/tailwindcss-mega-menu
Owner: justalever
Created: 2022-08-02T18:26:40.000Z (over 2 years ago)
Default Branch: main
Last Pushed: 2022-08-05T05:59:06.000Z (over 2 years ago)
Last Synced: 2024-10-09T13:05:10.280Z (3 months ago)
Topics: html, megamenu, stripe, tailwind, tailwindcss
Language: HTML
Homepage:
Size: 17.6 KB
Stars: 31
Watchers: 4
Forks: 16
Open Issues: 3
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        ![Code a mega menu with Tailwind CSS](https://f001.backblazeb2.com/file/webcrunch/tailwind-css-mega-menu.jpg)

# Code a mega menu with Tailwind CSS

If you are an avid Tailwind CSS user like myself, you probably landed here to learn how to make better use of Tailwind CSS for a more complex solution like a mega navigation menu.

I was inspired by Stripe's navigation, so part of this guide is stealing some inspiration from them. We'll need to leverage Tailwind CSS to make this all work, as well as some JavaScript.

To make my and your life easier, I'm reaching for the Vite JS. Think of Vite as a progressive front-end stack ready to use and less complex than something like Webpack. I'll often use this on static sites just or more front-end-focused apps.

📕 [Read the full guide](https://web-crunch.com/posts/code-a-mega-menu-with-tailwind-css) 

📺 [Watch the video tutorial](https://youtu.be/Y7i4ygh1wYw)