{
  "$schema": "https://design-tokens.github.io/community-group/format/",
  "name": "8i Interface System",
  "version": "0.1.0",
  "source": "#0f0fed",
  "asset": {
    "logoLight": { "$value": "assets/8i-logo-accent-light.svg", "$type": "string" },
    "logoDark": { "$value": "assets/8i-logo-accent-dark.svg", "$type": "string" }
  },
  "color": {
    "blue": {
      "950": { "$value": "#02020b", "$type": "color" },
      "900": { "$value": "#030312", "$type": "color" },
      "850": { "$value": "#06062a", "$type": "color" },
      "800": { "$value": "#09094a", "$type": "color" },
      "700": { "$value": "#0c0c78", "$type": "color" },
      "600": { "$value": "#0f0fb9", "$type": "color" },
      "500": { "$value": "#0f0fed", "$type": "color" },
      "400": { "$value": "#4a4af2", "$type": "color" },
      "300": { "$value": "#8585f8", "$type": "color" },
      "200": { "$value": "#b7b7fb", "$type": "color" },
      "100": { "$value": "#e3e3fe", "$type": "color" },
      "50": { "$value": "#f7f7ff", "$type": "color" }
    },
    "accent": {
      "700": { "$value": "#735a00", "$type": "color" },
      "600": { "$value": "#b58e1f", "$type": "color" },
      "500": { "$value": "#f6cd49", "$type": "color" },
      "400": { "$value": "#f8d866", "$type": "color" },
      "300": { "$value": "#fae284", "$type": "color" },
      "200": { "$value": "#fbe9a6", "$type": "color" },
      "100": { "$value": "#fdf5dc", "$type": "color" }
    },
    "theme": {
      "dark": {
        "background": { "$value": "{color.blue.900}", "$type": "color" },
        "surface": { "$value": "{color.blue.850}", "$type": "color" },
        "text": { "$value": "{color.blue.50}", "$type": "color" },
        "accentText": { "$value": "{color.accent.500}", "$type": "color" }
      },
      "light": {
        "background": { "$value": "{color.blue.50}", "$type": "color" },
        "surface": { "$value": "{color.blue.100}", "$type": "color" },
        "text": { "$value": "{color.blue.900}", "$type": "color" },
        "accentText": { "$value": "{color.accent.700}", "$type": "color" }
      }
    },
    "semantic": {
      "background": { "$value": "{color.blue.900}", "$type": "color" },
      "backgroundDeep": { "$value": "{color.blue.950}", "$type": "color" },
      "surface": { "$value": "{color.blue.850}", "$type": "color" },
      "surfaceRaised": { "$value": "{color.blue.800}", "$type": "color" },
      "action": { "$value": "{color.accent.500}", "$type": "color" },
      "actionHover": { "$value": "{color.accent.300}", "$type": "color" },
      "focus": { "$value": "{color.blue.200}", "$type": "color" },
      "text": { "$value": "{color.blue.50}", "$type": "color" },
      "textMuted": { "$value": "#aaaadc", "$type": "color" },
      "border": { "$value": "#b7b7fb22", "$type": "color" },
      "borderStrong": { "$value": "#b7b7fb48", "$type": "color" }
    }
  },
  "font": {
    "family": {
      "brand": { "$value": "Baloo Chettan 2, Arial, sans-serif", "$type": "fontFamily" },
      "data": { "$value": "ui-monospace, SFMono-Regular, monospace", "$type": "fontFamily" }
    },
    "weight": {
      "regular": { "$value": 400, "$type": "fontWeight" },
      "medium": { "$value": 500, "$type": "fontWeight" },
      "semibold": { "$value": 600, "$type": "fontWeight" },
      "bold": { "$value": 700, "$type": "fontWeight" },
      "heavy": { "$value": 800, "$type": "fontWeight" }
    },
    "size": {
      "label": { "$value": "0.75rem", "$type": "dimension" },
      "small": { "$value": "0.875rem", "$type": "dimension" },
      "body": { "$value": "1rem", "$type": "dimension" },
      "lead": { "$value": "1.25rem", "$type": "dimension" },
      "heading": { "$value": "clamp(2rem, 4vw, 4.5rem)", "$type": "string" },
      "display": { "$value": "clamp(3.25rem, 7vw, 7rem)", "$type": "string" }
    },
    "lineHeight": {
      "display": { "$value": 1.02, "$type": "number" },
      "heading": { "$value": 1.08, "$type": "number" },
      "body": { "$value": 1.6, "$type": "number" }
    }
  },
  "space": {
    "1": { "$value": "4px", "$type": "dimension" },
    "2": { "$value": "8px", "$type": "dimension" },
    "3": { "$value": "12px", "$type": "dimension" },
    "4": { "$value": "16px", "$type": "dimension" },
    "5": { "$value": "24px", "$type": "dimension" },
    "6": { "$value": "32px", "$type": "dimension" },
    "7": { "$value": "48px", "$type": "dimension" },
    "8": { "$value": "64px", "$type": "dimension" },
    "9": { "$value": "96px", "$type": "dimension" }
  },
  "effect": {
    "logoLightShadow": { "$value": "drop-shadow(0 3px 5px #0f0fed38)", "$type": "string" }
  },
  "radius": {
    "small": { "$value": "8px", "$type": "dimension" },
    "medium": { "$value": "12px", "$type": "dimension" },
    "large": { "$value": "18px", "$type": "dimension" },
    "pill": { "$value": "999px", "$type": "dimension" }
  },
  "motion": {
    "fast": { "$value": "160ms", "$type": "duration" },
    "standard": { "$value": "240ms", "$type": "duration" },
    "spatial": { "$value": "400ms", "$type": "duration" },
    "ease": { "$value": "cubic-bezier(.2,.7,.2,1)", "$type": "cubicBezier" }
  },
  "layout": {
    "contentMax": { "$value": "1180px", "$type": "dimension" },
    "readingMax": { "$value": "72ch", "$type": "dimension" },
    "desktopColumns": { "$value": 12, "$type": "number" },
    "breakpointMobile": { "$value": "760px", "$type": "dimension" },
    "breakpointCompact": { "$value": "1050px", "$type": "dimension" }
  },
  "icon": {
    "small": { "$value": "32px", "$type": "dimension" },
    "medium": { "$value": "48px", "$type": "dimension" },
    "large": { "$value": "64px", "$type": "dimension" },
    "paddingRatio": { "$value": 0.2, "$type": "number" }
  }
}