Component Browser
BrowseBuild
Home/Browse/Header 124

Header 124

ImageButtons22 nodes · 20 styles
Header 124

Description

Light hero section with stacked left-aligned content above and a single large landscape image positioned off-center to the right below.

Detailed Analysis

This hero strips the gallery down to a single impactful image with an asymmetric placement. The stacked content block (heading, description, dual CTAs) occupies the top-left portion of the section. Below, a large landscape-oriented image is positioned off-center to the right - it doesn't align with the left container edge but instead starts roughly at center and extends toward (or beyond) the right edge. This rightward offset creates dramatic negative space on the left and draws the eye toward the image content.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

heroheaderlight backgroundstacked contentsingle imagelandscape imageoff-centerright-alignedasymmetric placementnegative spaceCTAsdramatic layoutminimal

Raw Data (spacer)

{
  "meta": {
    "droppedLinks": 0,
    "dynBindRemovedCount": 0,
    "unlinkedSymbolCount": 0,
    "paginationRemovedCount": 0,
    "dynListBindRemovedCount": 0
  },
  "type": "@webflow/XscpData",
  "payload": {
    "ix1": [],
    "ix2": {
      "events": [],
      "actionLists": [],
      "interactions": []
    },
    "nodes": [
      {
        "_id": "6b77d9f5-ebe3-8c74-b2c6-559a18852fd2",
        "tag": "header",
        "data": {
          "tag": "header",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "c0f9e1ae-88c9-a57d-ce27-acf571a7972f"
        ],
        "children": [
          "6b77d9f5-ebe3-8c74-b2c6-559a18852fd3"
        ]
      },
      {
        "_id": "6b77d9f5-ebe3-8c74-b2c6-559a18852fd3",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "b0934d9a-875a-bb42-0630-12090a77fc73"
        ],
        "children": [
          "6b77d9f5-ebe3-8c74-b2c6-559a18852fd4"
        ]
      },
      {
        "_id": "6b77d9f5-ebe3-8c74-b2c6-559a18852fd4",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
      
... (truncated)