Component Browser
BrowseBuild
Home/Browse/Navbar 24

Navbar 24

ImageAccordion78 nodes ยท 49 styles
Navbar 24

Description

Mega menu dropdown combining navigation links grid, products section, and a single featured product card.

Detailed Analysis

This mega menu expands from the header navigation to display a three-column layout. The left column shows a 'Products' section with heading, description paragraph, and 'View all' button. The center features eight navigation links arranged in a 4x2 grid with bold typography. The right side showcases a single large product card with 'Best seller' badge, product image placeholder, product name, variant label, and $55 price. The header includes a script logo, four nav links (one with dropdown), and two CTA buttons.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

mega menuproduct showcasenavigation gridfeatured productbest sellere-commerce8 linksproduct carddropdownview allthree-columnpricing

Raw Data (spacer)

{
  "meta": {
    "droppedLinks": 0,
    "dynBindRemovedCount": 0,
    "unlinkedSymbolCount": 0,
    "paginationRemovedCount": 0,
    "dynListBindRemovedCount": 0
  },
  "type": "@webflow/XscpData",
  "payload": {
    "ix1": [],
    "ix2": {
      "events": [
        {
          "id": "e-4201",
          "name": "",
          "action": {
            "id": "",
            "config": {
              "delay": 0,
              "easing": "",
              "duration": 0,
              "actionListId": "a-880",
              "playInReverse": false,
              "autoStopEventId": "e-4202",
              "affectedElements": {}
            },
            "instant": true,
            "actionTypeId": "GENERAL_START_ACTION"
          },
          "config": {
            "loop": false,
            "delay": null,
            "effectIn": null,
            "direction": null,
            "playInReverse": false,
            "scrollOffsetUnit": null,
            "scrollOffsetValue": null
          },
          "target": {
            "id": "6540ac58fa7ea7efe56967ef|4edf18a8-4845-3a20-cdbd-2fe6e3c24092",
            "appliesTo": "ELEMENT",
            "styleBlockIds": []
          },
          "targets": [
            {
              "id": "6540ac58fa7ea7efe56967ef|4edf18a8-4845-3a20-cdbd-2fe6e3c24092",
              "appliesTo": "ELEMENT",
              "styleBlockIds": []
            }
          ],
          "createdOn": 1744790839657,
          "eventTypeId": "NAVBAR_OPEN",
          "mediaQueries": [
            "main",
            "medium",
            "small",
            "tiny"
          ],
          "animationType": "preset"
        },
        {
          "id": "e-4202",
          "name": "",
          "action": {
            "id": "",
            "config": {
              "delay": 0,
              "easing": "",
              "duration": 0,
              "actionListId": "a-881",
              "playInReverse": false,
              "autoStopEventId": "e-4201",
              "affec
... (truncated)