{
  "id": "ibm-carbon",
  "name": "IBM Carbon",
  "version": "1.0",
  "tagline": "Industrial. Authoritative. Sharp.",
  "description": "IBM's open-source Carbon design system: industrial enterprise aesthetic, sharp corners, IBM Plex everywhere, layered grays instead of shadows for depth, and Carbon Blue 60 (#0F62FE) as the canonical interactive color.",
  "inspired_by": { "name": "IBM Carbon", "url": "https://carbondesignsystem.com" },
  "vibe_tags": ["authoritative", "industrial", "enterprise", "data-dense", "blue", "sharp"],
  "domain_hint": "enterprise / industrial / data-heavy",

  "identity": {
    "logomark": { "shape": "8-bar", "description": "IBM 8-bar logo (Paul Rand, 1972)", "notes": "Carbon does not redefine the mark — defers to IBM Brand Center" }
  },

  "voice": {
    "principles": ["Authoritative, neutral, expert", "Open, optimistic, substantive (IBM Design Language)", "Crisp definitions, lots of must/should/do/don't"],
    "sample_headlines": [
      "Carbon is IBM's open source design system for products and digital experiences.",
      "Let's build.",
      "Smart loves problems."
    ],
    "sample_lead": "Carbon is IBM's open source design system for products and digital experiences. With the IBM Design Language as its foundation, the system consists of working code, design tools and resources, human interface guidelines, and a vibrant community of contributors.",
    "sample_code_lang": "scss",
    "sample_code": "@use '@carbon/react/scss/themes';\n@use '@carbon/react/scss/theme' with (\n  $theme: themes.$g100\n);"
  },

  "design_principles": [
    "Sharp corners — radius 0 by default.",
    "Layered grays carry depth; shadows reserved for overlays.",
    "Role-based tokens ($background, $layer, $text-primary, $interactive).",
    "Four base themes: White, Gray 10, Gray 90, Gray 100."
  ],

  "color": {
    "primary": {
      "name": "blue",
      "hex": "#0f62fe",
      "scale": {
        "10":  "#edf5ff",
        "20":  "#d0e2ff",
        "30":  "#a6c8ff",
        "40":  "#78a9ff",
        "50":  "#4589ff",
        "60":  "#0f62fe",
        "70":  "#0043ce",
        "80":  "#002d9c",
        "90":  "#001d6c",
        "100": "#001141"
      },
      "default_step": "60",
      "token_role": "$interactive"
    },
    "neutrals": {
      "white": "#ffffff",
      "gray_10":  "#f4f4f4",
      "gray_20":  "#e0e0e0",
      "gray_30":  "#c6c6c6",
      "gray_40":  "#a8a8a8",
      "gray_50":  "#8d8d8d",
      "gray_60":  "#6f6f6f",
      "gray_70":  "#525252",
      "gray_80":  "#393939",
      "gray_90":  "#262626",
      "gray_100": "#161616",
      "black": "#000000"
    },
    "semantic": {
      "danger":  "#da1e28",
      "warning": "#f1c21b",
      "success_light": "#198038",
      "success_dark":  "#24a148",
      "info": "#0f62fe"
    },
    "category_accents": {
      "cyan_60":    "#0072c3",
      "teal_60":    "#007d79",
      "purple_60":  "#8a3ffc",
      "magenta_60": "#d02670",
      "orange_60":  "#ba4e00"
    },
    "themes": {
      "white":   { "bg": "#ffffff" },
      "gray_10": { "bg": "#f4f4f4" },
      "gray_90": { "bg": "#262626" },
      "gray_100":{ "bg": "#161616" }
    },
    "page_bg_token": "themes.white.bg",
    "card_bg_token": "$layer (alternates White/Gray 10 in light)",
    "body_text_token": "neutrals.gray_100",
    "muted_text_token": "neutrals.gray_70"
  },

  "typography": {
    "fonts": {
      "sans":  { "family": "IBM Plex Sans",  "fallback": "\"Helvetica Neue\", Arial, sans-serif", "license": "OFL", "google": true, "weights": [300, 400, 600] },
      "serif": { "family": "IBM Plex Serif", "fallback": "Georgia, Times, serif", "license": "OFL", "google": true, "notes": "Used sparingly for fluid-quotation styles" },
      "mono":  { "family": "IBM Plex Mono",  "fallback": "Menlo, \"DejaVu Sans Mono\", \"Bitstream Vera Sans Mono\", Courier, monospace", "license": "OFL", "google": true }
    },
    "scale_ladder_px": [12, 14, 16, 18, 20, 24, 28, 32, 36, 42, 48, 54, 60, 68, 76, 84, 92],
    "type_sets": {
      "code_01":             { "size_px": 12, "line_px": 16, "weight": 400, "tracking_px": 0.32, "font": "mono" },
      "label_01":            { "size_px": 12, "line_px": 16, "weight": 400, "tracking_px": 0.32 },
      "helper_text_01":      { "size_px": 12, "line_px": 16, "weight": 400 },
      "body_compact_01":     { "size_px": 14, "line_px": 18, "weight": 400, "tracking_px": 0.16 },
      "body_01":             { "size_px": 14, "line_px": 20, "weight": 400, "tracking_px": 0.16 },
      "body_02":             { "size_px": 16, "line_px": 24, "weight": 400 },
      "heading_compact_01":  { "size_px": 14, "line_px": 18, "weight": 600, "tracking_px": 0.16 },
      "heading_01":          { "size_px": 14, "line_px": 20, "weight": 600 },
      "heading_02":          { "size_px": 16, "line_px": 24, "weight": 600 },
      "heading_03":          { "size_px": 20, "line_px": 28, "weight": 400 },
      "heading_04":          { "size_px": 28, "line_px": 36, "weight": 400 },
      "heading_05":          { "size_px": 32, "line_px": 40, "weight": 400 },
      "heading_06":          { "size_px": 42, "line_px": 50, "weight": 300 },
      "heading_07":          { "size_px": 54, "line_px": 64, "weight": 300 },
      "fluid_display_04":    { "size_px": 92, "line_px": 102, "weight": 300, "tracking_px": -0.64 }
    }
  },

  "tokens": {
    "spacing_scale": {
      "spacing_01": 2,  "spacing_02": 4,  "spacing_03": 8,   "spacing_04": 12,
      "spacing_05": 16, "spacing_06": 24, "spacing_07": 32,  "spacing_08": 40,
      "spacing_09": 48, "spacing_10": 64, "spacing_11": 80,  "spacing_12": 96,
      "spacing_13": 160
    },
    "radius_px": { "default": 0, "small": 2, "pill": 9999 },
    "shadow": { "notes": "Carbon uses the layering model (alternating gray values) instead of shadows. Shadows appear only on overlays/modals/popovers." },
    "motion": {
      "duration_ms": { "fast_01": 70, "fast_02": 110, "moderate_01": 150, "moderate_02": 240, "slow_01": 400, "slow_02": 700 },
      "easings": {
        "productive_standard": "cubic-bezier(0.2, 0, 0.38, 0.9)",
        "expressive": "cubic-bezier(0.4, 0.14, 0.3, 1)"
      },
      "notes": "Purposeful and functional — fast and subtle in product, more expressive in marketing."
    }
  },

  "components": {
    "button": {
      "shape": "rectangular (no radius)",
      "variants": {
        "primary":   { "bg": "#0f62fe", "fg": "#ffffff" },
        "secondary": { "bg": "#393939", "fg": "#ffffff" },
        "tertiary":  { "bg": "transparent", "border": "#0f62fe", "fg": "#0f62fe" },
        "danger":    { "bg": "#da1e28", "fg": "#ffffff" }
      },
      "mobile_behavior": "full-width"
    },
    "input": {
      "shape": "rectangular, no radius",
      "border_style": "bottom 1px only",
      "border_color": "#8d8d8d (light) / #6f6f6f (dark)",
      "field_bg_light": "#f4f4f4 (field_01) / #ffffff (field_02)",
      "focus_ring": "2px #0f62fe"
    },
    "tile": { "radius": 0, "no_shadow": true, "uses_layer_bg": true, "variants": ["clickable", "selectable", "expandable"] },
    "tag":  { "shape": "pill", "variants": ["red", "magenta", "purple", "blue", "cyan", "teal", "green", "gray", "cool-gray", "warm-gray"] },
    "notification": {
      "shape": "rectangular",
      "accent_bar_width_px": 3,
      "accent_left": true,
      "variants": ["inline", "toast", "actionable"]
    }
  },

  "do": [
    "Use sharp corners (radius 0) — it's the brand.",
    "Use the layering model — alternating $background/$layer for depth.",
    "Reference role-based tokens ($interactive, $support-error), never raw hex."
  ],
  "dont": [
    "Don't add radii to soften components — Carbon is industrial.",
    "Don't drop-shadow surfaces — use $layer instead.",
    "Don't hard-code hex — Carbon ships 4 themes."
  ],

  "provenance": {
    "scanned_from": [
      "https://carbondesignsystem.com/elements/color/overview/",
      "https://carbondesignsystem.com/elements/typography/overview/",
      "https://carbondesignsystem.com/elements/typography/type-sets/",
      "https://carbondesignsystem.com/elements/spacing/overview/",
      "https://carbondesignsystem.com/elements/themes/overview/",
      "https://github.com/carbon-design-system/carbon/blob/main/packages/colors/src/colors.ts"
    ],
    "scanned_at": "2026-05-25",
    "confidence": "high",
    "notes": "All hex values pulled from Carbon's published colors.ts source of truth. IBM Plex (Sans/Serif/Mono) all open-source under SIL OFL."
  }
}