{
  "$schema": "https://tr.designtokens.org/format/",
  "$description": "Design tokens for BMW-M",
  "meta": {
    "name": "BMW-M",
    "description": "A motorsport-engineering interface anchored on a near-black canvas with white BMW Type Next Latin display headlines in confident UPPERCASE. The brand carries no decorative voltage — its energy comes from full-bleed automotive photography (cars on tracks, driver-cockpit shots, carbon-fiber detail) and the iconic M tricolor stripe (light blue → dark blue → red) used sparingly as a brand signature on logos, dividers, and motorsport chrome. Type stays light to medium weight to feel European-engineered, never American-bombastic.",
    "theme": "dark"
  },
  "color": {
    "primary": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the primary role."
    },
    "ink": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the ink role."
    },
    "body": {
      "$value": "#bbbbbb",
      "$type": "color",
      "$description": "Use for the body role."
    },
    "body-strong": {
      "$value": "#e6e6e6",
      "$type": "color",
      "$description": "Use for the body strong role."
    },
    "muted": {
      "$value": "#7e7e7e",
      "$type": "color",
      "$description": "Use for the muted role."
    },
    "hairline": {
      "$value": "#3c3c3c",
      "$type": "color",
      "$description": "Use for the hairline role."
    },
    "hairline-strong": {
      "$value": "#262626",
      "$type": "color",
      "$description": "Use for the hairline strong role."
    },
    "canvas": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Use for the canvas role."
    },
    "surface-card": {
      "$value": "#1a1a1a",
      "$type": "color",
      "$description": "Use for the surface card role."
    },
    "surface-elevated": {
      "$value": "#262626",
      "$type": "color",
      "$description": "Use for the surface elevated role."
    },
    "surface-soft": {
      "$value": "#0d0d0d",
      "$type": "color",
      "$description": "Use for the surface soft role."
    },
    "on-primary": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Use for the on primary role."
    },
    "on-dark": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on dark role."
    },
    "m-blue-light": {
      "$value": "#0066b1",
      "$type": "color",
      "$description": "Use for the m blue light role."
    },
    "m-blue-dark": {
      "$value": "#1c69d4",
      "$type": "color",
      "$description": "Use for the m blue dark role."
    },
    "m-red": {
      "$value": "#e22718",
      "$type": "color",
      "$description": "Use for the m red role."
    },
    "bmw-blue": {
      "$value": "#1c69d4",
      "$type": "color",
      "$description": "Use for the bmw blue role."
    },
    "electric-blue": {
      "$value": "#0653b6",
      "$type": "color",
      "$description": "Use for the electric blue role."
    },
    "carbon-gray": {
      "$value": "#2b2b2b",
      "$type": "color",
      "$description": "Use for the carbon gray role."
    },
    "warning": {
      "$value": "#f4b400",
      "$type": "color",
      "$description": "Use for the warning role."
    },
    "success": {
      "$value": "#0fa336",
      "$type": "color",
      "$description": "Use for the success role."
    }
  },
  "typography": {
    "display-xl": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "80px",
        "fontWeight": 700,
        "lineHeight": 1,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for display xl."
    },
    "display-lg": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "56px",
        "fontWeight": 700,
        "lineHeight": 1.05,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for display lg."
    },
    "display-md": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "40px",
        "fontWeight": 700,
        "lineHeight": 1.1,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for display md."
    },
    "display-sm": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "32px",
        "fontWeight": 700,
        "lineHeight": 1.15,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for display sm."
    },
    "title-lg": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "24px",
        "fontWeight": 700,
        "lineHeight": 1.3,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for title lg."
    },
    "title-md": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "20px",
        "fontWeight": 400,
        "lineHeight": 1.4,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for title md."
    },
    "title-sm": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "18px",
        "fontWeight": 400,
        "lineHeight": 1.4,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for title sm."
    },
    "label-uppercase": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "14px",
        "fontWeight": 700,
        "lineHeight": 1.3,
        "letterSpacing": "1.5px"
      },
      "$type": "typography",
      "$description": "Typography style for label uppercase."
    },
    "body-md": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin Light, BMWTypeNextLatin, sans-serif",
        "fontSize": "16px",
        "fontWeight": 300,
        "lineHeight": 1.5,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for body md."
    },
    "body-sm": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin Light, sans-serif",
        "fontSize": "14px",
        "fontWeight": 300,
        "lineHeight": 1.5,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for body sm."
    },
    "caption": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "12px",
        "fontWeight": 400,
        "lineHeight": 1.4,
        "letterSpacing": "0.5px"
      },
      "$type": "typography",
      "$description": "Typography style for caption."
    },
    "button": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "14px",
        "fontWeight": 700,
        "lineHeight": 1,
        "letterSpacing": "1.5px"
      },
      "$type": "typography",
      "$description": "Typography style for button."
    },
    "nav-link": {
      "$value": {
        "fontFamily": "BMWTypeNextLatin, sans-serif",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": 1.4,
        "letterSpacing": "0.5px"
      },
      "$type": "typography",
      "$description": "Typography style for nav link."
    }
  },
  "spacing": {
    "xxs": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Spacing step xxs."
    },
    "xs": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Spacing step xs."
    },
    "sm": {
      "$value": "12px",
      "$type": "dimension",
      "$description": "Spacing step sm."
    },
    "md": {
      "$value": "16px",
      "$type": "dimension",
      "$description": "Spacing step md."
    },
    "lg": {
      "$value": "24px",
      "$type": "dimension",
      "$description": "Spacing step lg."
    },
    "xl": {
      "$value": "40px",
      "$type": "dimension",
      "$description": "Spacing step xl."
    },
    "xxl": {
      "$value": "64px",
      "$type": "dimension",
      "$description": "Spacing step xxl."
    },
    "section": {
      "$value": "96px",
      "$type": "dimension",
      "$description": "Spacing step section."
    }
  },
  "radius": {
    "none": {
      "$value": "0px",
      "$type": "dimension",
      "$description": "Border radius none."
    },
    "xs": {
      "$value": "2px",
      "$type": "dimension",
      "$description": "Border radius xs."
    },
    "sm": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Border radius sm."
    },
    "md": {
      "$value": "6px",
      "$type": "dimension",
      "$description": "Border radius md."
    },
    "full": {
      "$value": "9999px",
      "$type": "dimension",
      "$description": "Border radius full."
    }
  },
  "shadow": {},
  "$extensions": {
    "com.design-md-editor.source": {
      "url": "https://www.bmw-m.com/",
      "note": "Official brand website used for visual comparison."
    }
  }
}
