{
  "$schema": "https://tr.designtokens.org/format/",
  "$description": "Design tokens for Together-AI-Inspired",
  "meta": {
    "name": "Together-AI-Inspired",
    "description": "An inspired interpretation of Together AI's design language — an AI infrastructure platform whose surface alternates between near-black hero bands (with a three-color orange-magenta-periwinkle gradient as the single piece of brand chrome) and bright white research / pricing / docs bands, knit together by a custom display sans and an uppercase mono eyebrow face.",
    "theme": "light"
  },
  "color": {
    "primary": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Use for the primary role."
    },
    "on-primary": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on primary role."
    },
    "ink": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Use for the ink role."
    },
    "body": {
      "$value": "#959494",
      "$type": "color",
      "$description": "Use for the body role."
    },
    "hairline": {
      "$value": "#959494",
      "$type": "color",
      "$description": "Use for the hairline role."
    },
    "canvas": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the canvas role."
    },
    "canvas-dark": {
      "$value": "#010120",
      "$type": "color",
      "$description": "Use for the canvas dark role."
    },
    "surface-dark-soft": {
      "$value": "#313641",
      "$type": "color",
      "$description": "Use for the surface dark soft role."
    },
    "on-dark": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on dark role."
    },
    "accent-orange": {
      "$value": "#fc4c02",
      "$type": "color",
      "$description": "Use for the accent orange role."
    },
    "accent-magenta": {
      "$value": "#ef2cc1",
      "$type": "color",
      "$description": "Use for the accent magenta role."
    },
    "accent-periwinkle": {
      "$value": "#bdbbff",
      "$type": "color",
      "$description": "Use for the accent periwinkle role."
    },
    "accent-mint": {
      "$value": "#c8f6f9",
      "$type": "color",
      "$description": "Use for the accent mint role."
    }
  },
  "typography": {
    "display-xxl": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "64px",
        "fontWeight": 500,
        "lineHeight": "70.4px",
        "letterSpacing": "-1.92px"
      },
      "$type": "typography",
      "$description": "Typography style for display xxl."
    },
    "display-xl": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "40px",
        "fontWeight": 500,
        "lineHeight": "48px",
        "letterSpacing": "-0.8px"
      },
      "$type": "typography",
      "$description": "Typography style for display xl."
    },
    "display-lg": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "28px",
        "fontWeight": 500,
        "lineHeight": "32.2px",
        "letterSpacing": "-0.42px"
      },
      "$type": "typography",
      "$description": "Typography style for display lg."
    },
    "display-md": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "22px",
        "fontWeight": 500,
        "lineHeight": "25.3px",
        "letterSpacing": "-0.22px"
      },
      "$type": "typography",
      "$description": "Typography style for display md."
    },
    "body-lg": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "18px",
        "fontWeight": 400,
        "lineHeight": "23.4px",
        "letterSpacing": "-0.18px"
      },
      "$type": "typography",
      "$description": "Typography style for body lg."
    },
    "body-lg-strong": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "18px",
        "fontWeight": 500,
        "lineHeight": "23.4px",
        "letterSpacing": "-0.18px"
      },
      "$type": "typography",
      "$description": "Typography style for body lg strong."
    },
    "body-md": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "16px",
        "fontWeight": 400,
        "lineHeight": "20.8px",
        "letterSpacing": "-0.16px"
      },
      "$type": "typography",
      "$description": "Typography style for body md."
    },
    "body-md-strong": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "16px",
        "fontWeight": 500,
        "lineHeight": "20.8px",
        "letterSpacing": "-0.16px"
      },
      "$type": "typography",
      "$description": "Typography style for body md strong."
    },
    "caption": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": "19.6px",
        "letterSpacing": "0"
      },
      "$type": "typography",
      "$description": "Typography style for caption."
    },
    "caption-strong": {
      "$value": {
        "fontFamily": "The Future, Inter, Helvetica Neue, Arial, sans-serif",
        "fontSize": "14px",
        "fontWeight": 500,
        "lineHeight": "19.6px",
        "letterSpacing": "0"
      },
      "$type": "typography",
      "$description": "Typography style for caption strong."
    },
    "mono-caps-button": {
      "$value": {
        "fontFamily": "PP Neue Montreal Mono, ui-monospace, SF Mono, Menlo, monospace",
        "fontSize": "16px",
        "fontWeight": 500,
        "lineHeight": "16px",
        "letterSpacing": "0.08px"
      },
      "$type": "typography",
      "$description": "Typography style for mono caps button."
    },
    "mono-caps-eyebrow": {
      "$value": {
        "fontFamily": "PP Neue Montreal Mono, ui-monospace, SF Mono, Menlo, monospace",
        "fontSize": "11px",
        "fontWeight": 500,
        "lineHeight": "11px",
        "letterSpacing": "0.55px"
      },
      "$type": "typography",
      "$description": "Typography style for mono caps eyebrow."
    },
    "mono-caps-label": {
      "$value": {
        "fontFamily": "PP Neue Montreal Mono, ui-monospace, SF Mono, Menlo, monospace",
        "fontSize": "11px",
        "fontWeight": 500,
        "lineHeight": "15.4px",
        "letterSpacing": "0.055px"
      },
      "$type": "typography",
      "$description": "Typography style for mono caps label."
    },
    "mono-caption": {
      "$value": {
        "fontFamily": "PP Neue Montreal Mono, ui-monospace, SF Mono, Menlo, monospace",
        "fontSize": "10px",
        "fontWeight": 400,
        "lineHeight": "14px",
        "letterSpacing": "0.05px"
      },
      "$type": "typography",
      "$description": "Typography style for mono caption."
    }
  },
  "spacing": {
    "xxs": {
      "$value": "2px",
      "$type": "dimension",
      "$description": "Spacing step xxs."
    },
    "xs": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Spacing step xs."
    },
    "sm": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Spacing step sm."
    },
    "md": {
      "$value": "12px",
      "$type": "dimension",
      "$description": "Spacing step md."
    },
    "lg": {
      "$value": "16px",
      "$type": "dimension",
      "$description": "Spacing step lg."
    },
    "xl": {
      "$value": "20px",
      "$type": "dimension",
      "$description": "Spacing step xl."
    },
    "2xl": {
      "$value": "24px",
      "$type": "dimension",
      "$description": "Spacing step 2xl."
    },
    "3xl": {
      "$value": "32px",
      "$type": "dimension",
      "$description": "Spacing step 3xl."
    },
    "4xl": {
      "$value": "44px",
      "$type": "dimension",
      "$description": "Spacing step 4xl."
    },
    "5xl": {
      "$value": "48px",
      "$type": "dimension",
      "$description": "Spacing step 5xl."
    },
    "6xl": {
      "$value": "55.2px",
      "$type": "dimension",
      "$description": "Spacing step 6xl."
    },
    "section": {
      "$value": "80px",
      "$type": "dimension",
      "$description": "Spacing step section."
    }
  },
  "radius": {
    "none": {
      "$value": "0px",
      "$type": "dimension",
      "$description": "Border radius none."
    },
    "xs": {
      "$value": "3.25px",
      "$type": "dimension",
      "$description": "Border radius xs."
    },
    "sm": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Border radius sm."
    },
    "md": {
      "$value": "8px",
      "$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.together.ai/",
      "note": "Official brand website used for visual comparison."
    }
  }
}
