{
  "$description": "Brand: Vercel (vercel@1.0.0)",
  "color": {
    "swatches": {
      "$description": "Source-of-truth color swatches from palette vercel@1.0.0",
      "vercel-black": {
        "$value": "#000000",
        "$type": "color",
        "$description": "Pure black — the canvas of the marketing site."
      },
      "vercel-white": {
        "$value": "#FFFFFF",
        "$type": "color",
        "$description": "Pure white — the foreground of the marketing site."
      },
      "dark-bg-100": {
        "$value": "#0A0A0A",
        "$type": "color",
        "$description": "ds-background-100 (hsl 0,0%,4%) — page canvas in dark mode."
      },
      "dark-bg-200": {
        "$value": "#000000",
        "$type": "color",
        "$description": "ds-background-200 — deeper canvas / under-page."
      },
      "dark-gray-100": {
        "$value": "#1A1A1A",
        "$type": "color",
        "$description": "ds-gray-100 — subtle surface tint."
      },
      "dark-gray-200": {
        "$value": "#1F1F1F",
        "$type": "color",
        "$description": "ds-gray-200."
      },
      "dark-gray-300": {
        "$value": "#292929",
        "$type": "color",
        "$description": "ds-gray-300."
      },
      "dark-gray-400": {
        "$value": "#2E2E2E",
        "$type": "color",
        "$description": "ds-gray-400."
      },
      "dark-gray-500": {
        "$value": "#454545",
        "$type": "color",
        "$description": "ds-gray-500 — borders."
      },
      "dark-gray-600": {
        "$value": "#878787",
        "$type": "color",
        "$description": "ds-gray-600."
      },
      "dark-gray-700": {
        "$value": "#8F8F8F",
        "$type": "color",
        "$description": "ds-gray-700."
      },
      "dark-gray-800": {
        "$value": "#7D7D7D",
        "$type": "color",
        "$description": "ds-gray-800."
      },
      "dark-gray-900": {
        "$value": "#A1A1A1",
        "$type": "color",
        "$description": "ds-gray-900 — muted text."
      },
      "dark-gray-1000": {
        "$value": "#EDEDED",
        "$type": "color",
        "$description": "ds-gray-1000 — primary text in dark mode."
      },
      "light-bg-100": {
        "$value": "#FFFFFF",
        "$type": "color",
        "$description": "Page canvas in light mode."
      },
      "light-bg-200": {
        "$value": "#FAFAFA",
        "$type": "color",
        "$description": "Subtle layered surface."
      },
      "light-gray-200": {
        "$value": "#EAEAEA",
        "$type": "color",
        "$description": "Hairline border."
      },
      "light-gray-600": {
        "$value": "#666666",
        "$type": "color",
        "$description": "Secondary text."
      },
      "light-gray-1000": {
        "$value": "#171717",
        "$type": "color",
        "$description": "Primary text in light mode (rgb 23,23,23 — body color on vercel.com)."
      },
      "vercel-blue": {
        "$value": "#0070F3",
        "$type": "color",
        "$description": "ds-blue-600 — the classic Vercel link / accent blue."
      },
      "vercel-blue-bright": {
        "$value": "#52A8FF",
        "$type": "color",
        "$description": "ds-blue-900 — bright link blue used on dark surfaces."
      },
      "vercel-red": {
        "$value": "#FF6166",
        "$type": "color",
        "$description": "ds-red-900 — error / destructive."
      },
      "vercel-amber": {
        "$value": "#F2A60D",
        "$type": "color",
        "$description": "ds-amber-900 — warning."
      },
      "vercel-green": {
        "$value": "#62C073",
        "$type": "color",
        "$description": "ds-green-900 — success."
      }
    }
  },
  "font": {
    "$description": "Typography roles mapped to font atoms",
    "heading": {
      "family": {
        "$value": [
          "Geist",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Helvetica",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "heading role → Geist Sans (geist@1.0.0)"
      },
      "weight": {
        "100": {
          "$value": 100,
          "$type": "fontWeight"
        },
        "200": {
          "$value": 200,
          "$type": "fontWeight"
        },
        "300": {
          "$value": 300,
          "$type": "fontWeight"
        },
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$type": "fontWeight"
        },
        "800": {
          "$value": 800,
          "$type": "fontWeight"
        },
        "900": {
          "$value": 900,
          "$type": "fontWeight"
        },
        "$description": "Available font weights"
      }
    },
    "body": {
      "family": {
        "$value": [
          "Geist",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Helvetica",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "body role → Geist Sans (geist@1.0.0)"
      },
      "weight": {
        "100": {
          "$value": 100,
          "$type": "fontWeight"
        },
        "200": {
          "$value": 200,
          "$type": "fontWeight"
        },
        "300": {
          "$value": 300,
          "$type": "fontWeight"
        },
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$type": "fontWeight"
        },
        "800": {
          "$value": 800,
          "$type": "fontWeight"
        },
        "900": {
          "$value": 900,
          "$type": "fontWeight"
        },
        "$description": "Available font weights"
      }
    },
    "mono": {
      "family": {
        "$value": [
          "Geist Mono",
          "SFMono-Regular",
          "Menlo",
          "Monaco",
          "Consolas",
          "Liberation Mono",
          "Courier New",
          "monospace"
        ],
        "$type": "fontFamily",
        "$description": "mono role → Geist Mono (geist-mono@1.0.0)"
      },
      "weight": {
        "100": {
          "$value": 100,
          "$type": "fontWeight"
        },
        "200": {
          "$value": 200,
          "$type": "fontWeight"
        },
        "300": {
          "$value": 300,
          "$type": "fontWeight"
        },
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$type": "fontWeight"
        },
        "800": {
          "$value": 800,
          "$type": "fontWeight"
        },
        "900": {
          "$value": 900,
          "$type": "fontWeight"
        },
        "$description": "Available font weights"
      }
    }
  },
  "$extensions": {
    "com.brand-atoms.rules": [
      {
        "type": "contrastRatio",
        "target": "text-primary",
        "severity": "error",
        "rationale": "Geist's foreground/background pairs are designed AA-out-of- the-box: dark-gray-1000 (#EDEDED) on dark-bg-100 (#0A0A0A) gives ~17:1, and light-gray-1000 (#171717) on light-bg-100 (#FFFFFF) gives ~16:1. Both clear AA with substantial margin.\n",
        "against": "background",
        "minRatio": 4.5,
        "standard": "WCAG-AA"
      },
      {
        "type": "colorChoice",
        "target": "roles.colors.primary",
        "severity": "error",
        "rationale": "Vercel's primary brand color is monochrome — black in light mode, white in dark. The functional hues (blue/red/amber/ green) carry semantic meaning (link/error/warning/success) and must not stand in for the brand identity.\n",
        "allowed": [
          "vercel-black",
          "vercel-white"
        ],
        "forbidden": [
          "vercel-blue",
          "vercel-red",
          "vercel-amber",
          "vercel-green"
        ]
      },
      {
        "type": "forbiddenTreatment",
        "target": "logo",
        "severity": "error",
        "rationale": "Vercel's triangle mark is monochrome by design. Gradient, recolored, or skewed variants are explicitly disallowed by the brand guidelines at vercel.com/design/brands.\n",
        "treatments": [
          "stretched",
          "rotated",
          "recolored",
          "drop-shadow",
          "gradient-fill",
          "on-busy-photo"
        ]
      },
      {
        "type": "enumMembership",
        "target": "typography.heading.fontWeight",
        "severity": "warning",
        "rationale": "Vercel's marketing surfaces use Geist Medium (500), SemiBold (600), and Bold (700) for headings. Lighter weights are reserved for fine UI labels; weights above 800 compromise the typeface's neutral geometric voice.\n",
        "allowed": [
          "500",
          "600",
          "700",
          "800"
        ]
      },
      {
        "type": "fontPairing",
        "target": "typography.heading",
        "severity": "error",
        "rationale": "Geist Sans is the only display face on vercel.com; the visual hierarchy is established entirely by size. A 1.5× minimum heading-to-body ratio preserves the typographic rhythm without introducing a second family.\n",
        "requires": "body",
        "minSizeRatio": 1.5
      },
      {
        "type": "accessibilityRequirement",
        "target": "*",
        "severity": "error",
        "rationale": "WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. Geist Design System tokens are AA-compliant by construction; consumers must not derive intermediate stops that defeat that property.\n",
        "standard": "WCAG-AA",
        "criterion": "1.4.3"
      },
      {
        "type": "contextRestriction",
        "target": "roles.colors.accent",
        "severity": "warning",
        "rationale": "Vercel Blue (#0070F3) is the documented link / focus accent — used as a thin stroke or small-glyph fill, never as a large background block. Large blue fills compete with the monochrome brand voice.\n",
        "allowedContexts": [
          "link",
          "focus-ring",
          "data-viz-primary"
        ],
        "forbiddenContexts": [
          "background",
          "large-fill"
        ]
      },
      {
        "type": "compositionConstraint",
        "target": "roles.colors.identity",
        "severity": "error",
        "rationale": "The brand block is black-on-white or white-on-black only. Pairing the identity color directly with functional hues breaks the monochrome brand contract.\n",
        "pairsWith": [
          "vercel-white"
        ],
        "doesNotPairWith": [
          "vercel-blue",
          "vercel-red",
          "vercel-amber",
          "vercel-green"
        ]
      }
    ],
    "com.brand-atoms.assets": [],
    "com.brand-atoms.provenance": {
      "source": "https://vercel.com/design/brands",
      "license": "Proprietary — All Rights Reserved",
      "attribution": "Vercel, Inc. — visual identity captured from the deployed stylesheet on vercel.com (Geist Design System tokens) and the open-source Geist font repository (github.com/vercel/geist-font). The Geist Design System and the Vercel marks are property of Vercel, Inc.; the Geist font binaries are released under the SIL Open Font License v1.1.\n",
      "importedDate": "2026-05-17",
      "notes": "Vercel's marketing site renders in forced dark mode, but the Geist Design System publishes both light and dark token sets; this atom uses `identity: vercel-black` so brand surfaces render in the dark-first voice regardless of consumer theme.\n"
    },
    "com.brand-atoms.references": {
      "palette": "vercel@1.0.0",
      "fonts": {
        "heading": "geist@1.0.0",
        "body": "geist@1.0.0",
        "mono": "geist-mono@1.0.0"
      }
    }
  }
}