{
  "$schema": "https://tr.designtokens.org/format/",
  "$description": "Design tokens for PlayStation",
  "meta": {
    "name": "PlayStation",
    "description": "A three-surface marketing system organized around alternating black, white, and PlayStation Blue chapters that scroll past the viewer like a console launch trailer. Each section has a single editorial purpose — hero photography, console product render, PS Plus tier callout, news strip — and each owns one of three full-bleed canvas modes. The chrome is unusually quiet for a gaming brand: bright PlayStation Blue (`#0070d1`) carries every primary CTA as a fully-rounded pill, the proprietary SST face renders display copy at a signature weight 300 (light) for an airy, premium feel, and a crisp 8px-radius secondary card system carries product info on either canvas mode. The system never decorates — no gradient backgrounds on chrome, no atmospheric mesh, no drop shadows beyond a faint section-divide. Imagery does all the heavy lifting: console glamour shots, game key art, and PS Plus tier illustrations occupy 60-90% of every section, with copy compressed into a small editorial slot.",
    "theme": "light"
  },
  "color": {
    "primary": {
      "$value": "#0070d1",
      "$type": "color",
      "$description": "Use for the primary role."
    },
    "primary-pressed": {
      "$value": "#0064b7",
      "$type": "color",
      "$description": "Use for the primary pressed role."
    },
    "primary-active": {
      "$value": "#004d8d",
      "$type": "color",
      "$description": "Use for the primary active role."
    },
    "on-primary": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on primary role."
    },
    "link-light": {
      "$value": "#0064b7",
      "$type": "color",
      "$description": "Use for the link light role."
    },
    "link-dark": {
      "$value": "#53b1ff",
      "$type": "color",
      "$description": "Use for the link dark role."
    },
    "commerce": {
      "$value": "#d53b00",
      "$type": "color",
      "$description": "Use for the commerce role."
    },
    "commerce-pressed": {
      "$value": "#aa2f00",
      "$type": "color",
      "$description": "Use for the commerce pressed role."
    },
    "commerce-link-base": {
      "$value": "#d63d00",
      "$type": "color",
      "$description": "Use for the commerce link base role."
    },
    "on-commerce": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on commerce role."
    },
    "ink": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Use for the ink role."
    },
    "ink-deep": {
      "$value": "#121314",
      "$type": "color",
      "$description": "Use for the ink deep role."
    },
    "ink-elevated": {
      "$value": "#181818",
      "$type": "color",
      "$description": "Use for the ink elevated role."
    },
    "charcoal": {
      "$value": "#1f2024",
      "$type": "color",
      "$description": "Use for the charcoal role."
    },
    "body-light": {
      "$value": "rgba(0,0,0,0.6)",
      "$type": "color",
      "$description": "Use for the body light role."
    },
    "mute-light": {
      "$value": "#6b6b6b",
      "$type": "color",
      "$description": "Use for the mute light role."
    },
    "ash-light": {
      "$value": "#cccccc",
      "$type": "color",
      "$description": "Use for the ash light role."
    },
    "body-dark": {
      "$value": "rgba(255,255,255,0.7)",
      "$type": "color",
      "$description": "Use for the body dark role."
    },
    "mute-dark": {
      "$value": "rgba(229,229,229,0.55)",
      "$type": "color",
      "$description": "Use for the mute dark role."
    },
    "ash-dark": {
      "$value": "rgba(229,229,229,0.2)",
      "$type": "color",
      "$description": "Use for the ash dark role."
    },
    "canvas-light": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the canvas light role."
    },
    "surface-soft": {
      "$value": "#f3f3f3",
      "$type": "color",
      "$description": "Use for the surface soft role."
    },
    "surface-card": {
      "$value": "#f5f7fa",
      "$type": "color",
      "$description": "Use for the surface card role."
    },
    "surface-filter": {
      "$value": "rgba(245,247,250,0.3)",
      "$type": "color",
      "$description": "Use for the surface filter role."
    },
    "canvas-dark": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Use for the canvas dark role."
    },
    "surface-dark-elevated": {
      "$value": "#121314",
      "$type": "color",
      "$description": "Use for the surface dark elevated role."
    },
    "surface-dark-card": {
      "$value": "#181818",
      "$type": "color",
      "$description": "Use for the surface dark card role."
    },
    "hairline-light": {
      "$value": "#f3f3f3",
      "$type": "color",
      "$description": "Use for the hairline light role."
    },
    "hairline-dark": {
      "$value": "rgba(229,229,229,0.2)",
      "$type": "color",
      "$description": "Use for the hairline dark role."
    },
    "on-dark": {
      "$value": "#ffffff",
      "$type": "color",
      "$description": "Use for the on dark role."
    },
    "on-dark-mute": {
      "$value": "#cccccc",
      "$type": "color",
      "$description": "Use for the on dark mute role."
    },
    "warning": {
      "$value": "#c81b3a",
      "$type": "color",
      "$description": "Use for the warning role."
    },
    "ps-plus-gold-start": {
      "$value": "#ffce21",
      "$type": "color",
      "$description": "Use for the ps plus gold start role."
    },
    "ps-plus-gold-mid": {
      "$value": "#f5a623",
      "$type": "color",
      "$description": "Use for the ps plus gold mid role."
    },
    "ps-plus-gold-end": {
      "$value": "#ee8e00",
      "$type": "color",
      "$description": "Use for the ps plus gold end role."
    },
    "marathon-yellow": {
      "$value": "#deff20",
      "$type": "color",
      "$description": "Use for the marathon yellow role."
    }
  },
  "typography": {
    "display-xl": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "54px",
        "fontWeight": 300,
        "lineHeight": 1.25,
        "letterSpacing": "-0.1px"
      },
      "$type": "typography",
      "$description": "Typography style for display xl."
    },
    "display-lg": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "44px",
        "fontWeight": 300,
        "lineHeight": 1.25,
        "letterSpacing": "0.1px"
      },
      "$type": "typography",
      "$description": "Typography style for display lg."
    },
    "display-md": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "35px",
        "fontWeight": 300,
        "lineHeight": 1.25,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for display md."
    },
    "heading-xl": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "28px",
        "fontWeight": 300,
        "lineHeight": 1.25,
        "letterSpacing": "0.1px"
      },
      "$type": "typography",
      "$description": "Typography style for heading xl."
    },
    "heading-lg": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "22px",
        "fontWeight": 300,
        "lineHeight": 1.25,
        "letterSpacing": "0.1px"
      },
      "$type": "typography",
      "$description": "Typography style for heading lg."
    },
    "heading-md": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "18px",
        "fontWeight": 600,
        "lineHeight": 1,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for heading md."
    },
    "body-md": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "18px",
        "fontWeight": 400,
        "lineHeight": 1.5,
        "letterSpacing": "0.1px"
      },
      "$type": "typography",
      "$description": "Typography style for body md."
    },
    "body-strong": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "18px",
        "fontWeight": 500,
        "lineHeight": 1.25,
        "letterSpacing": "0.4px"
      },
      "$type": "typography",
      "$description": "Typography style for body strong."
    },
    "body-sm": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "16px",
        "fontWeight": 400,
        "lineHeight": 1.5,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for body sm."
    },
    "caption-md": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "14px",
        "fontWeight": 400,
        "lineHeight": 1.5,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for caption md."
    },
    "caption-sm": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "12px",
        "fontWeight": 500,
        "lineHeight": 1.5,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for caption sm."
    },
    "link-md": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "18px",
        "fontWeight": 400,
        "lineHeight": 1.5,
        "letterSpacing": 0
      },
      "$type": "typography",
      "$description": "Typography style for link md."
    },
    "button-lg": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "18px",
        "fontWeight": 700,
        "lineHeight": 1.25,
        "letterSpacing": "0.45px"
      },
      "$type": "typography",
      "$description": "Typography style for button lg."
    },
    "button-md": {
      "$value": {
        "fontFamily": "PlayStation SST",
        "fontSize": "14px",
        "fontWeight": 700,
        "lineHeight": 1.25,
        "letterSpacing": "0.324px"
      },
      "$type": "typography",
      "$description": "Typography style for button md."
    }
  },
  "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": "32px",
      "$type": "dimension",
      "$description": "Spacing step xl."
    },
    "xxl": {
      "$value": "48px",
      "$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."
    },
    "sm": {
      "$value": "4px",
      "$type": "dimension",
      "$description": "Border radius sm."
    },
    "md": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Border radius md."
    },
    "lg": {
      "$value": "16px",
      "$type": "dimension",
      "$description": "Border radius lg."
    },
    "full": {
      "$value": "9999px",
      "$type": "dimension",
      "$description": "Border radius full."
    }
  },
  "shadow": {},
  "$extensions": {
    "com.design-md-editor.source": {
      "url": "https://www.playstation.com/",
      "note": "Official brand website used for visual comparison."
    }
  }
}