Stats 17

Background VideoVideoButtonsBackground Image2 ColumnsCards51 nodes · 33 styles

Description

Two-column statistics section with tagline, heading, paragraph, buttons on left and four percentage metrics in 2x2 grid on right, dark charcoal theme

Detailed Analysis

This Stats 17 component presents a dark charcoal-themed two-column layout without background imagery. The left column contains a tagline, medium-length heading, descriptive paragraph, and two CTA buttons (one outlined with white border, one text link with arrow). The right column displays four statistics arranged in a 2x2 grid, each showing 50% with a short heading description. The stats feature vertical line dividers on the left side of each metric. The solid dark charcoal background provides clean contrast for white typography without visual distractions.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

statisticsmetricspercentagesdark themetwo columns2x2 gridbuttonstaglineparagraphcharcoal backgroundfour statssplit layoutvertical dividers

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": "43175d91-f242-b6cf-f38d-bb37cf408208",
        "tag": "section",
        "data": {
          "tag": "section",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "34896fc7-e34b-00bb-a33c-c1e0bff1834d",
          "ce83d433-2d50-15cc-15dd-1ea4bbe443f4"
        ],
        "children": [
          "43175d91-f242-b6cf-f38d-bb37cf408209",
          "43175d91-f242-b6cf-f38d-bb37cf408237"
        ]
      },
      {
        "_id": "43175d91-f242-b6cf-f38d-bb37cf408209",
        "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": [
          "43175d91-f242-b6cf-f38d-bb37cf40820a"
        ]
      },
      {
        "_id": "43175d91-f242-b6cf-f38d-bb37cf40820a",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
   
... (truncated)

Detailed Analysis

{ "meta": { "droppedLinks": 0, "dynBindRemovedCount": 0, "unlinkedSymbolCount": 0, "paginationRemovedCount": 0, "dynListBindRemovedCount": 0 }, "type": "@webflow/XscpData", "payload": { "ix1": [], "ix2": { "events": [], "actionLists": [], "interactions": [] }, "nodes": [ { "_id": "43175d91-f242-b6cf-f38d-bb37cf408208", "tag": "section", "data": { "tag": "section", "attr": { "id": "" }, "text": false, "xattr": [], "search": { "exclude": false }, "devlink": { "slot": "", "runtimeProps": {} }, "visibility": { "conditions": [] }, "displayName": "" }, "type": "Block", "classes": [ "34896fc7-e34b-00bb-a33c-c1e0bff1834d", "ce83d433-2d50-15cc-15dd-1ea4bbe443f4" ], "children": [ "43175d91-f242-b6cf-f38d-bb37cf408209", "43175d91-f242-b6cf-f38d-bb37cf408237" ] }, { "_id": "43175d91-f242-b6cf-f38d-bb37cf408209", "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": [ "43175d91-f242-b6cf-f38d-bb37cf40820a" ] }, { "_id": "43175d91-f242-b6cf-f38d-bb37cf40820a", "tag": "div", "data": { "tag": "div", "attr": { "id": "" }, ... (truncated)