Stats 7

Buttons3 ColumnsCards42 nodes · 26 styles

Description

A statistics section with stacked single-column layout featuring tagline, heading, description, three percentage stats with vertical bars, and dual buttons.

Detailed Analysis

This stats component uses a vertical stacked layout with all content left-aligned. Starting with a tagline, followed by a large heading, then descriptive paragraph, three percentage statistics (30%) displayed horizontally with vertical accent bars and short headings, and finally dual CTA buttons (outlined primary, text link with arrow) at the bottom. The single-column approach creates a clear reading flow from top to bottom. White background with black typography maintains clean aesthetics.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

stacked layoutstatistics sectionsingle columnpercentage displayvertical flowstats with buttonsleft-alignedKPI sectionlinear layoutmetrics displayvertical accent barscontent hierarchy

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": "e25a687c-66a5-188d-d344-57d5b208603e",
        "tag": "section",
        "data": {
          "tag": "section",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "54d4f754-39dd-4fa9-7ac9-1ba2363225a7"
        ],
        "children": [
          "e25a687c-66a5-188d-d344-57d5b208603f"
        ]
      },
      {
        "_id": "e25a687c-66a5-188d-d344-57d5b208603f",
        "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": [
          "e25a687c-66a5-188d-d344-57d5b2086040"
        ]
      },
      {
        "_id": "e25a687c-66a5-188d-d344-57d5b2086040",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
    
... (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": "e25a687c-66a5-188d-d344-57d5b208603e", "tag": "section", "data": { "tag": "section", "attr": { "id": "" }, "text": false, "xattr": [], "search": { "exclude": false }, "devlink": { "slot": "", "runtimeProps": {} }, "visibility": { "conditions": [] }, "displayName": "" }, "type": "Block", "classes": [ "54d4f754-39dd-4fa9-7ac9-1ba2363225a7" ], "children": [ "e25a687c-66a5-188d-d344-57d5b208603f" ] }, { "_id": "e25a687c-66a5-188d-d344-57d5b208603f", "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": [ "e25a687c-66a5-188d-d344-57d5b2086040" ] }, { "_id": "e25a687c-66a5-188d-d344-57d5b2086040", "tag": "div", "data": { "tag": "div", "attr": { "id": "" }, "text": false, "xattr": [], "search": { "exclude": false ... (truncated)