{
  "name": "stats-band-big-numbers",
  "kind": "block",
  "primary": "section",
  "page": "/catalog/ui-patterns/v050-content-blocks/v050-content-blocks.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {},
  "html": "<section>\n    <grid-ui columns=\"2 4@md\" gap=\"4\">\n      <col-ui gap=\"0\" align=\"center\">\n        <text-ui variant=\"display\" size=\"lg\" color=\"accent\">99.99%</text-ui>\n        <text-ui size=\"sm\" color=\"subtle\">Uptime SLA</text-ui>\n      </col-ui>\n      <col-ui gap=\"0\" align=\"center\">\n        <text-ui variant=\"display\" size=\"lg\" color=\"accent\">12,000+</text-ui>\n        <text-ui size=\"sm\" color=\"subtle\">Teams shipping</text-ui>\n      </col-ui>\n      <col-ui gap=\"0\" align=\"center\">\n        <text-ui variant=\"display\" size=\"lg\" color=\"accent\">4.2B</text-ui>\n        <text-ui size=\"sm\" color=\"subtle\">Requests / month</text-ui>\n      </col-ui>\n      <col-ui gap=\"0\" align=\"center\">\n        <text-ui variant=\"display\" size=\"lg\" color=\"accent\">86</text-ui>\n        <text-ui size=\"sm\" color=\"subtle\">Countries</text-ui>\n      </col-ui>\n    </grid-ui>\n  </section>",
  "source": "catalog/ui-patterns/v050-content-blocks/v050-content-blocks.contents.html",
  "metadata": {
    "domain": "marketing",
    "description": "Marketing stats band — a horizontal row of three or four big headline numbers, each a large display figure over a short caption (uptime, customers, requests, countries). The 'by the numbers / trusted at scale' proof band that sits between a hero and the features on a landing page.",
    "keywords": [
      "stats",
      "band",
      "big",
      "numbers",
      "metrics",
      "marketing",
      "proof",
      "social",
      "proof",
      "by",
      "the",
      "numbers",
      "at",
      "scale",
      "headline",
      "figures",
      "uptime",
      "customers",
      "users",
      "requests",
      "countries",
      "growth",
      "display",
      "stats",
      "row",
      "landing",
      "page",
      "trust",
      "signals",
      "key",
      "metrics",
      "impressive",
      "numbers",
      "statistics",
      "band",
      "achievements"
    ]
  },
  "captured_at": "2026-06-10T19:45:40.486Z",
  "template": [
    {
      "id": "text",
      "component": "Text",
      "color": "accent",
      "size": "lg",
      "variant": "display",
      "textContent": "99.99%"
    },
    {
      "id": "text-2",
      "component": "Text",
      "color": "subtle",
      "size": "sm",
      "textContent": "Uptime SLA"
    },
    {
      "id": "column",
      "component": "Column",
      "align": "center",
      "gap": "0",
      "children": [
        "text",
        "text-2"
      ]
    },
    {
      "id": "text-3",
      "component": "Text",
      "color": "accent",
      "size": "lg",
      "variant": "display",
      "textContent": "12,000+"
    },
    {
      "id": "text-4",
      "component": "Text",
      "color": "subtle",
      "size": "sm",
      "textContent": "Teams shipping"
    },
    {
      "id": "column-2",
      "component": "Column",
      "align": "center",
      "gap": "0",
      "children": [
        "text-3",
        "text-4"
      ]
    },
    {
      "id": "text-5",
      "component": "Text",
      "color": "accent",
      "size": "lg",
      "variant": "display",
      "textContent": "4.2B"
    },
    {
      "id": "text-6",
      "component": "Text",
      "color": "subtle",
      "size": "sm",
      "textContent": "Requests / month"
    },
    {
      "id": "column-3",
      "component": "Column",
      "align": "center",
      "gap": "0",
      "children": [
        "text-5",
        "text-6"
      ]
    },
    {
      "id": "text-7",
      "component": "Text",
      "color": "accent",
      "size": "lg",
      "variant": "display",
      "textContent": "86"
    },
    {
      "id": "text-8",
      "component": "Text",
      "color": "subtle",
      "size": "sm",
      "textContent": "Countries"
    },
    {
      "id": "column-4",
      "component": "Column",
      "align": "center",
      "gap": "0",
      "children": [
        "text-7",
        "text-8"
      ]
    },
    {
      "id": "grid",
      "component": "Grid",
      "columns": "2 4@md",
      "gap": "4",
      "children": [
        "column",
        "column-2",
        "column-3",
        "column-4"
      ]
    },
    {
      "id": "root",
      "component": "Section",
      "children": [
        "grid"
      ]
    }
  ]
}
