
Navigation Menu & Mega Menu
Design a desktop navigation bar with one mega menu expansion. The bar should show the site’s primary sections, one active item, and clear hover and focus states. Keep the top-level nav simple; the complexity belongs in the expanded panel.
Inside the mega menu, group links into labeled sections with a clear reading order. Include one featured block for a promoted destination, product update, or help link. The layout should make it obvious which links are primary, which are secondary, and where the user should click next.
Show how the menu opens and closes, and how it behaves when the pointer moves between the trigger and the panel. Add a collapsed or overflow treatment for tighter widths so the pattern still works when space is limited. Keep spacing, alignment, and hierarchy consistent across all states.
Anchor your mega menu with recognizable icons and short, descriptive labels for quick user orientation.
Better at UI design with every challenge
Select complexity and generate challenge.
