{
  "$description": "Brand: IBM — dark mode",
  "color": {
    "swatches": {
      "$description": "Source-of-truth color swatches from palette carbon@1.0.0",
      "black": {
        "$value": "#000000",
        "$type": "color"
      },
      "white": {
        "$value": "#FFFFFF",
        "$type": "color"
      },
      "gray-10": {
        "$value": "#F4F4F4",
        "$type": "color"
      },
      "gray-20": {
        "$value": "#E0E0E0",
        "$type": "color"
      },
      "gray-30": {
        "$value": "#C6C6C6",
        "$type": "color"
      },
      "gray-40": {
        "$value": "#A8A8A8",
        "$type": "color"
      },
      "gray-50": {
        "$value": "#8D8D8D",
        "$type": "color"
      },
      "gray-60": {
        "$value": "#6F6F6F",
        "$type": "color"
      },
      "gray-70": {
        "$value": "#525252",
        "$type": "color"
      },
      "gray-80": {
        "$value": "#393939",
        "$type": "color"
      },
      "gray-90": {
        "$value": "#262626",
        "$type": "color",
        "$description": "g90 theme canvas."
      },
      "gray-100": {
        "$value": "#161616",
        "$type": "color",
        "$description": "g100 theme canvas."
      },
      "cool-gray-10": {
        "$value": "#F2F4F8",
        "$type": "color"
      },
      "cool-gray-20": {
        "$value": "#DDE1E6",
        "$type": "color"
      },
      "cool-gray-30": {
        "$value": "#C1C7CD",
        "$type": "color"
      },
      "cool-gray-40": {
        "$value": "#A2A9B0",
        "$type": "color"
      },
      "cool-gray-50": {
        "$value": "#878D96",
        "$type": "color"
      },
      "cool-gray-60": {
        "$value": "#697077",
        "$type": "color"
      },
      "cool-gray-70": {
        "$value": "#4D5358",
        "$type": "color"
      },
      "cool-gray-80": {
        "$value": "#343A3F",
        "$type": "color"
      },
      "cool-gray-90": {
        "$value": "#21272A",
        "$type": "color"
      },
      "cool-gray-100": {
        "$value": "#121619",
        "$type": "color"
      },
      "warm-gray-10": {
        "$value": "#F7F3F2",
        "$type": "color"
      },
      "warm-gray-20": {
        "$value": "#E5E0DF",
        "$type": "color"
      },
      "warm-gray-30": {
        "$value": "#CAC5C4",
        "$type": "color"
      },
      "warm-gray-40": {
        "$value": "#ADA8A8",
        "$type": "color"
      },
      "warm-gray-50": {
        "$value": "#8F8B8B",
        "$type": "color"
      },
      "warm-gray-60": {
        "$value": "#726E6E",
        "$type": "color"
      },
      "warm-gray-70": {
        "$value": "#565151",
        "$type": "color"
      },
      "warm-gray-80": {
        "$value": "#3C3838",
        "$type": "color"
      },
      "warm-gray-90": {
        "$value": "#272525",
        "$type": "color"
      },
      "warm-gray-100": {
        "$value": "#171414",
        "$type": "color"
      },
      "blue-10": {
        "$value": "#EDF5FF",
        "$type": "color"
      },
      "blue-20": {
        "$value": "#D0E2FF",
        "$type": "color"
      },
      "blue-30": {
        "$value": "#A6C8FF",
        "$type": "color"
      },
      "blue-40": {
        "$value": "#78A9FF",
        "$type": "color"
      },
      "blue-50": {
        "$value": "#4589FF",
        "$type": "color"
      },
      "blue-60": {
        "$value": "#0F62FE",
        "$type": "color",
        "$description": "Carbon primary interactive color."
      },
      "blue-70": {
        "$value": "#0043CE",
        "$type": "color"
      },
      "blue-80": {
        "$value": "#002D9C",
        "$type": "color"
      },
      "blue-90": {
        "$value": "#001D6C",
        "$type": "color"
      },
      "blue-100": {
        "$value": "#001141",
        "$type": "color"
      },
      "red-10": {
        "$value": "#FFF1F1",
        "$type": "color"
      },
      "red-20": {
        "$value": "#FFD7D9",
        "$type": "color"
      },
      "red-30": {
        "$value": "#FFB3B8",
        "$type": "color"
      },
      "red-40": {
        "$value": "#FF8389",
        "$type": "color"
      },
      "red-50": {
        "$value": "#FA4D56",
        "$type": "color"
      },
      "red-60": {
        "$value": "#DA1E28",
        "$type": "color",
        "$description": "Danger / error."
      },
      "red-70": {
        "$value": "#A2191F",
        "$type": "color"
      },
      "red-80": {
        "$value": "#750E13",
        "$type": "color"
      },
      "red-90": {
        "$value": "#520408",
        "$type": "color"
      },
      "red-100": {
        "$value": "#2D0709",
        "$type": "color"
      },
      "magenta-10": {
        "$value": "#FFF0F7",
        "$type": "color"
      },
      "magenta-20": {
        "$value": "#FFD6E8",
        "$type": "color"
      },
      "magenta-30": {
        "$value": "#FFAFD2",
        "$type": "color"
      },
      "magenta-40": {
        "$value": "#FF7EB6",
        "$type": "color"
      },
      "magenta-50": {
        "$value": "#EE5396",
        "$type": "color"
      },
      "magenta-60": {
        "$value": "#D02670",
        "$type": "color"
      },
      "magenta-70": {
        "$value": "#9F1853",
        "$type": "color"
      },
      "magenta-80": {
        "$value": "#740937",
        "$type": "color"
      },
      "magenta-90": {
        "$value": "#510224",
        "$type": "color"
      },
      "magenta-100": {
        "$value": "#2A0A18",
        "$type": "color"
      },
      "purple-10": {
        "$value": "#F6F2FF",
        "$type": "color"
      },
      "purple-20": {
        "$value": "#E8DAFF",
        "$type": "color"
      },
      "purple-30": {
        "$value": "#D4BBFF",
        "$type": "color"
      },
      "purple-40": {
        "$value": "#BE95FF",
        "$type": "color"
      },
      "purple-50": {
        "$value": "#A56EFF",
        "$type": "color"
      },
      "purple-60": {
        "$value": "#8A3FFC",
        "$type": "color"
      },
      "purple-70": {
        "$value": "#6929C4",
        "$type": "color"
      },
      "purple-80": {
        "$value": "#491D8B",
        "$type": "color"
      },
      "purple-90": {
        "$value": "#31135E",
        "$type": "color"
      },
      "purple-100": {
        "$value": "#1C0F30",
        "$type": "color"
      },
      "cyan-10": {
        "$value": "#E5F6FF",
        "$type": "color"
      },
      "cyan-20": {
        "$value": "#BAE6FF",
        "$type": "color"
      },
      "cyan-30": {
        "$value": "#82CFFF",
        "$type": "color"
      },
      "cyan-40": {
        "$value": "#33B1FF",
        "$type": "color"
      },
      "cyan-50": {
        "$value": "#1192E8",
        "$type": "color"
      },
      "cyan-60": {
        "$value": "#0072C3",
        "$type": "color"
      },
      "cyan-70": {
        "$value": "#00539A",
        "$type": "color"
      },
      "cyan-80": {
        "$value": "#003A6D",
        "$type": "color"
      },
      "cyan-90": {
        "$value": "#012749",
        "$type": "color"
      },
      "cyan-100": {
        "$value": "#061727",
        "$type": "color"
      },
      "teal-10": {
        "$value": "#D9FBFB",
        "$type": "color"
      },
      "teal-20": {
        "$value": "#9EF0F0",
        "$type": "color"
      },
      "teal-30": {
        "$value": "#3DDBD9",
        "$type": "color"
      },
      "teal-40": {
        "$value": "#08BDBA",
        "$type": "color"
      },
      "teal-50": {
        "$value": "#009D9A",
        "$type": "color"
      },
      "teal-60": {
        "$value": "#007D79",
        "$type": "color"
      },
      "teal-70": {
        "$value": "#005D5D",
        "$type": "color"
      },
      "teal-80": {
        "$value": "#004144",
        "$type": "color"
      },
      "teal-90": {
        "$value": "#022B30",
        "$type": "color"
      },
      "teal-100": {
        "$value": "#081A1C",
        "$type": "color"
      },
      "green-10": {
        "$value": "#DEFBE6",
        "$type": "color"
      },
      "green-20": {
        "$value": "#A7F0BA",
        "$type": "color"
      },
      "green-30": {
        "$value": "#6FDC8C",
        "$type": "color"
      },
      "green-40": {
        "$value": "#42BE65",
        "$type": "color"
      },
      "green-50": {
        "$value": "#24A148",
        "$type": "color",
        "$description": "Success."
      },
      "green-60": {
        "$value": "#198038",
        "$type": "color"
      },
      "green-70": {
        "$value": "#0E6027",
        "$type": "color"
      },
      "green-80": {
        "$value": "#044317",
        "$type": "color"
      },
      "green-90": {
        "$value": "#022D0D",
        "$type": "color"
      },
      "green-100": {
        "$value": "#071908",
        "$type": "color"
      },
      "yellow-10": {
        "$value": "#FCF4D6",
        "$type": "color"
      },
      "yellow-20": {
        "$value": "#FDDC69",
        "$type": "color"
      },
      "yellow-30": {
        "$value": "#F1C21B",
        "$type": "color",
        "$description": "Warning."
      },
      "yellow-40": {
        "$value": "#D2A106",
        "$type": "color"
      },
      "yellow-50": {
        "$value": "#B28600",
        "$type": "color"
      },
      "yellow-60": {
        "$value": "#8E6A00",
        "$type": "color"
      },
      "yellow-70": {
        "$value": "#684E00",
        "$type": "color"
      },
      "yellow-80": {
        "$value": "#483700",
        "$type": "color"
      },
      "yellow-90": {
        "$value": "#302400",
        "$type": "color"
      },
      "yellow-100": {
        "$value": "#1C1500",
        "$type": "color"
      },
      "orange-10": {
        "$value": "#FFF2E8",
        "$type": "color"
      },
      "orange-20": {
        "$value": "#FFD9BE",
        "$type": "color"
      },
      "orange-30": {
        "$value": "#FFB784",
        "$type": "color"
      },
      "orange-40": {
        "$value": "#FF832B",
        "$type": "color"
      },
      "orange-50": {
        "$value": "#EB6200",
        "$type": "color"
      },
      "orange-60": {
        "$value": "#BA4E00",
        "$type": "color"
      },
      "orange-70": {
        "$value": "#8A3800",
        "$type": "color"
      },
      "orange-80": {
        "$value": "#5E2900",
        "$type": "color"
      },
      "orange-90": {
        "$value": "#3E1A00",
        "$type": "color"
      },
      "orange-100": {
        "$value": "#231000",
        "$type": "color"
      }
    },
    "roles": {
      "$description": "Semantic color roles (dark mode) mapped to palette swatches",
      "background": {
        "$value": "{color.swatches.gray-100}",
        "$type": "color",
        "$description": "background role → Gray 100"
      },
      "surface": {
        "$value": "{color.swatches.gray-90}",
        "$type": "color",
        "$description": "surface role → Gray 90"
      },
      "surface-elevated": {
        "$value": "{color.swatches.gray-80}",
        "$type": "color",
        "$description": "surface-elevated role → Gray 80"
      },
      "text-primary": {
        "$value": "{color.swatches.gray-10}",
        "$type": "color",
        "$description": "text-primary role → Gray 10"
      },
      "text-secondary": {
        "$value": "{color.swatches.gray-30}",
        "$type": "color",
        "$description": "text-secondary role → Gray 30"
      },
      "text-tertiary": {
        "$value": "{color.swatches.gray-40}",
        "$type": "color",
        "$description": "text-tertiary role → Gray 40"
      },
      "primary": {
        "$value": "{color.swatches.blue-60}",
        "$type": "color",
        "$description": "primary role → Blue 60"
      },
      "primary-hover": {
        "$value": "{color.swatches.blue-50}",
        "$type": "color",
        "$description": "primary-hover role → Blue 50"
      },
      "accent": {
        "$value": "{color.swatches.purple-50}",
        "$type": "color",
        "$description": "accent role → Purple 50"
      },
      "accent-hover": {
        "$value": "{color.swatches.purple-40}",
        "$type": "color",
        "$description": "accent-hover role → Purple 40"
      },
      "warning": {
        "$value": "{color.swatches.yellow-30}",
        "$type": "color",
        "$description": "warning role → Yellow 30"
      },
      "warning-hover": {
        "$value": "{color.swatches.yellow-20}",
        "$type": "color",
        "$description": "warning-hover role → Yellow 20"
      },
      "error": {
        "$value": "{color.swatches.red-50}",
        "$type": "color",
        "$description": "error role → Red 50"
      },
      "success": {
        "$value": "{color.swatches.green-40}",
        "$type": "color",
        "$description": "success role → Green 40"
      },
      "border": {
        "$value": "{color.swatches.gray-80}",
        "$type": "color",
        "$description": "border role → Gray 80"
      },
      "brand-overrides": {
        "$description": "Brand-level role overrides (take precedence over palette role mappings)",
        "identity": {
          "$value": "{color.swatches.white}",
          "$type": "color",
          "$description": "Brand role identity → White"
        },
        "on-identity": {
          "$value": "{color.swatches.gray-100}",
          "$type": "color",
          "$description": "Brand role on-identity → Gray 100"
        },
        "primary": {
          "$value": "{color.swatches.blue-60}",
          "$type": "color",
          "$description": "Brand role primary → Blue 60"
        },
        "primary-hover": {
          "$value": "{color.swatches.blue-70}",
          "$type": "color",
          "$description": "Brand role primary-hover → Blue 70"
        },
        "accent": {
          "$value": "{color.swatches.blue-60}",
          "$type": "color",
          "$description": "Brand role accent → Blue 60"
        },
        "accent-hover": {
          "$value": "{color.swatches.blue-70}",
          "$type": "color",
          "$description": "Brand role accent-hover → Blue 70"
        },
        "mark": {
          "$value": "{color.swatches.blue-60}",
          "$type": "color",
          "$description": "Brand role mark → Blue 60"
        },
        "success": {
          "$value": "{color.swatches.green-50}",
          "$type": "color",
          "$description": "Brand role success → Green 50"
        },
        "warning": {
          "$value": "{color.swatches.yellow-30}",
          "$type": "color",
          "$description": "Brand role warning → Yellow 30"
        },
        "error": {
          "$value": "{color.swatches.red-60}",
          "$type": "color",
          "$description": "Brand role error → Red 60"
        },
        "text-primary-light": {
          "$value": "{color.swatches.gray-100}",
          "$type": "color",
          "$description": "Brand role text-primary-light → Gray 100"
        },
        "text-primary-dark": {
          "$value": "{color.swatches.gray-10}",
          "$type": "color",
          "$description": "Brand role text-primary-dark → Gray 10"
        },
        "background-light": {
          "$value": "{color.swatches.white}",
          "$type": "color",
          "$description": "Brand role background-light → White"
        },
        "background-dark": {
          "$value": "{color.swatches.gray-100}",
          "$type": "color",
          "$description": "Brand role background-dark → Gray 100"
        },
        "surface-light": {
          "$value": "{color.swatches.gray-10}",
          "$type": "color",
          "$description": "Brand role surface-light → Gray 10"
        },
        "surface-dark": {
          "$value": "{color.swatches.gray-90}",
          "$type": "color",
          "$description": "Brand role surface-dark → Gray 90"
        },
        "text-secondary-light": {
          "$value": "{color.swatches.gray-70}",
          "$type": "color",
          "$description": "Brand role text-secondary-light → Gray 70"
        },
        "text-tertiary-light": {
          "$value": "{color.swatches.gray-60}",
          "$type": "color",
          "$description": "Brand role text-tertiary-light → Gray 60"
        },
        "border-light": {
          "$value": "{color.swatches.gray-30}",
          "$type": "color",
          "$description": "Brand role border-light → Gray 30"
        }
      }
    }
  },
  "font": {
    "$description": "Typography roles mapped to font atoms",
    "heading": {
      "family": {
        "$value": [
          "IBM Plex Sans",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Roboto",
          "Helvetica Neue",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "heading role → IBM Plex Sans (ibm-plex-sans@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"
        },
        "$description": "Available font weights"
      }
    },
    "body": {
      "family": {
        "$value": [
          "IBM Plex Sans",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Roboto",
          "Helvetica Neue",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "body role → IBM Plex Sans (ibm-plex-sans@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"
        },
        "$description": "Available font weights"
      }
    },
    "serif": {
      "family": {
        "$value": [
          "IBM Plex Serif",
          "Iowan Old Style",
          "Apple Garamond",
          "Baskerville",
          "Times New Roman",
          "serif"
        ],
        "$type": "fontFamily",
        "$description": "serif role → IBM Plex Serif (ibm-plex-serif@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"
        },
        "$description": "Available font weights"
      }
    },
    "mono": {
      "family": {
        "$value": [
          "IBM Plex Mono",
          "ui-monospace",
          "SFMono-Regular",
          "Menlo",
          "Consolas",
          "Liberation Mono",
          "monospace"
        ],
        "$type": "fontFamily",
        "$description": "mono role → IBM Plex Mono (ibm-plex-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"
        },
        "$description": "Available font weights"
      }
    }
  }
}