whynot-design/ir/tokens.json

{
  "color": {
    "$type": "color",
    "ink": {
      "$value": "#0A0A0A"
    },
    "ink-2": {
      "$value": "#1F1F1F"
    },
    "ink-3": {
      "$value": "#5C5C5C"
    },
    "ink-4": {
      "$value": "#8A8A8A"
    },
    "ink-5": {
      "$value": "#B5B5B3"
    },
    "line": {
      "$value": "#E5E5E2"
    },
    "line-strong": {
      "$value": "#C9C9C5"
    },
    "line-soft": {
      "$value": "#F0F0EC"
    },
    "paper": {
      "$value": "#FFFFFF"
    },
    "paper-2": {
      "$value": "#FAFAF7"
    },
    "paper-3": {
      "$value": "#F4F4EF"
    },
    "fg-1": {
      "$value": "{color.ink}"
    },
    "fg-2": {
      "$value": "{color.ink-3}"
    },
    "fg-3": {
      "$value": "{color.ink-4}"
    },
    "fg-mute": {
      "$value": "{color.ink-5}"
    },
    "fg-on-dark": {
      "$value": "#FAFAF7"
    },
    "bg-1": {
      "$value": "{color.paper}"
    },
    "bg-2": {
      "$value": "{color.paper-2}"
    },
    "bg-3": {
      "$value": "{color.paper-3}"
    },
    "bg-invert": {
      "$value": "{color.ink}"
    },
    "border": {
      "$value": "{color.line}"
    },
    "border-strong": {
      "$value": "{color.line-strong}"
    },
    "border-soft": {
      "$value": "{color.line-soft}"
    },
    "hi": {
      "$value": "#FFE14A"
    },
    "hi-2": {
      "$value": "#FFD400"
    },
    "hi-ink": {
      "$value": "#1A1500"
    },
    "status-raw": {
      "$value": "#B5B5B3"
    },
    "status-weak": {
      "$value": "#8A8A8A"
    },
    "status-medium": {
      "$value": "#5C5C5C"
    },
    "status-strong": {
      "$value": "#0A0A0A"
    },
    "status-commercial": {
      "$value": "#FFD400"
    },
    "status-error": {
      "$value": "#B33A2E"
    },
    "status-error-bg": {
      "$value": "#FCF3F1"
    },
    "status-warn": {
      "$value": "#C28000"
    },
    "status-warn-bg": {
      "$value": "#FFFCEB"
    },
    "status-success": {
      "$value": "#2F6B3A"
    },
    "status-success-bg": {
      "$value": "#F2F7F2"
    },
    "status-info": {
      "$value": "#2E5C8A"
    },
    "status-info-bg": {
      "$value": "#F2F5FA"
    }
  },
  "fontFamily": {
    "$type": "fontFamily",
    "ff-sans": {
      "$value": "ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif"
    },
    "ff-mono": {
      "$value": "ui-monospace, \"SF Mono\", Menlo, Consolas, monospace"
    },
    "ff-serif": {
      "$value": "ui-serif, Georgia, \"Times New Roman\", serif"
    }
  },
  "fontSize": {
    "$type": "dimension",
    "fs-xs": {
      "$value": "11px"
    },
    "fs-sm": {
      "$value": "13px"
    },
    "fs-base": {
      "$value": "15px"
    },
    "fs-md": {
      "$value": "17px"
    },
    "fs-lg": {
      "$value": "20px"
    },
    "fs-xl": {
      "$value": "24px"
    },
    "fs-2xl": {
      "$value": "32px"
    },
    "fs-3xl": {
      "$value": "44px"
    },
    "fs-4xl": {
      "$value": "64px"
    },
    "fs-5xl": {
      "$value": "96px"
    }
  },
  "lineHeight": {
    "$type": "number",
    "lh-tight": {
      "$value": "1.05"
    },
    "lh-snug": {
      "$value": "1.25"
    },
    "lh-base": {
      "$value": "1.5"
    },
    "lh-loose": {
      "$value": "1.7"
    }
  },
  "letterSpacing": {
    "$type": "dimension",
    "tr-tight": {
      "$value": "-0.02em"
    },
    "tr-snug": {
      "$value": "-0.01em"
    },
    "tr-base": {
      "$value": "0em"
    },
    "tr-mono": {
      "$value": "0.02em"
    },
    "tr-label": {
      "$value": "0.08em"
    }
  },
  "space": {
    "$type": "dimension",
    "sp-1": {
      "$value": "4px"
    },
    "sp-2": {
      "$value": "8px"
    },
    "sp-3": {
      "$value": "12px"
    },
    "sp-4": {
      "$value": "16px"
    },
    "sp-5": {
      "$value": "24px"
    },
    "sp-6": {
      "$value": "32px"
    },
    "sp-7": {
      "$value": "48px"
    },
    "sp-8": {
      "$value": "64px"
    },
    "sp-9": {
      "$value": "96px"
    },
    "sp-10": {
      "$value": "128px"
    }
  },
  "radius": {
    "$type": "dimension",
    "r-0": {
      "$value": "0px"
    },
    "r-1": {
      "$value": "2px"
    },
    "r-2": {
      "$value": "4px"
    },
    "r-3": {
      "$value": "8px"
    },
    "r-pill": {
      "$value": "999px"
    }
  },
  "shadow": {
    "$type": "shadow",
    "shadow-0": {
      "$value": "none"
    },
    "shadow-1": {
      "$value": "0 1px 0 var(--line)"
    },
    "shadow-2": {
      "$value": "0 1px 0 var(--line-strong)"
    },
    "shadow-3": {
      "$value": "0 4px 12px -6px rgba(10,10,10,0.10)"
    }
  }
}