← Palettes · [email protected]

PlayStation

PlayStation's brand palette as captured from the live design system on playstation.com. The PlayStation brand is built around a calibrated blue family — the primary action color (#0070CC bright / #0068BD link / #003697 deep) and the diagonal "PlayStation Blue gradient" that ramps from the deep navy to the bright accent — with a commerce-orange family (#D63D00 / #D53B00 / #AA2F00) reserved for buy / store affordances, and the documented PS Plus yellow (#FCC71D) for the subscription brand mark. The chrome is dual-mode: a paper canvas (#FFFFFF / #F5F7FA) for the marketing site and a deep ink canvas (#121314 / #1F2024 / #17181A) for the console UI and dark-mode hero modules. Typography is the proprietary SST family declared via @font-face as `sst`.

29 swatches 15 light roles 15 dark roles playstationgamingconsolebluesonysub-brand

Swatches

ps-blue

#0070CC

Primary action blue — --color-role-backgrounds-primary- link-base-light (rgb(0 112 204)). The "Sign In / Buy / Find out more" CTA fill on the marketing site.

ps-blue-link

#0068BD

Inline-link blue — --color-role-text-link-base-light (rgb(0 104 189)). Body-text link color and the standard PlayStation identifier hue.

ps-blue-hover

#0064B7

Pressed / active variant — --color-role-backgrounds- primary-link-focus-light (rgb(0 100 183)).

ps-blue-active

#005DAA

Deepest pressed state — --color-role-text-link-hover-light (rgb(0 93 170)).

ps-blue-deep

#003697

Gradient endpoint — --color-role-section-gradients-blue- start (rgb(0 54 151)). The deep end of the documented "PlayStation Blue gradient" (#003697 → #0068BD).

ps-blue-bright

#31A1FF

Bright link variant for dark mode — --color-role-text- link-active-dark (rgb(15 146 255)) and adjacent token.

ps-blue-pale

#D4DCE9

Pale blue surface — --color-2-darken-10-light. Quiet branded background for secondary-link backgrounds.

ps-blue-paler

#EBEEF0

Lightest blue surface — --color-3-light (rgb(235 238 240)). Tertiary page background.

ink

#121314

Primary dark canvas — --color-role-page-backgrounds- primary-dark (rgb(18 19 20)). Console UI / dark hero module background.

ink-deep

#090A0A

Deepest near-black — --color-role-page-backgrounds- secondary-dark (rgb(9 10 10)). Used for the deepest modal scrims.

ink-surface

#17181A

Elevated dark surface — --color-role-gradients-content- dark start (rgb(23 24 26)). Card and panel backgrounds on dark mode.

ink-surface-high

#1F2024

High-elevation dark surface — --color-7-dark (rgb(31 32 36)). Modal backgrounds and elevated card chrome.

ink-divider

#2C2D33

Quiet divider on dark surface — --color-6-dark (rgb(44 45 51)).

paper

#FFFFFF

Primary light canvas — --color-role-page-backgrounds- primary-light. Marketing-site page background.

paper-surface

#F5F7FA

Light elevated surface — --color-role-page-backgrounds- secondary-light (rgb(245 247 250)).

paper-divider

#F3F3F3

Quiet divider on light surface — --color-8-light / --color-role-borders-divider-line-base-light.

ash-text

#1F1F1F

Primary body text — observed as the live body computed color (rgb(31 31 31)).

ash-secondary

#6B6B6B

Secondary text — --color-role-text-secondary-light (rgb(107 107 107)).

ash-tertiary

#969799

Tertiary text and quiet icon fills — --color-6-light (rgb(150 151 153)).

ash-disabled

#D2D4D9

Disabled-link surface — --color-7-light (rgb(210 212 217)).

ash-secondary-dark

#B2B2B2

Secondary text on dark surface — --color-role-text- secondary-dark (rgb(178 178 178)).

ps-orange

#D63D00

Commerce / "buy" orange — --color-role-backgrounds- commerce-link-base-dark (rgb(214 61 0)). Store and checkout primary action.

ps-orange-base

#D53B00

Commerce base — --color-role-backgrounds-commerce-link- base-light (rgb(213 59 0)).

ps-orange-hover

#C03500

Commerce hover — --color-role-backgrounds-commerce-link- hover-light (rgb(192 53 0)).

ps-orange-active

#AA2F00

Commerce active — --color-role-backgrounds-commerce-link- active-light (rgb(170 47 0)).

ps-plus-yellow

#FCC71D

PS Plus subscription brand — --color-role-text-ps-plus- light (rgb(252 199 29)). Reserved for PS Plus tiers and subscription affordances.

ps-warning

#C81B3A

Warning red — --color-role-text-warning-light (rgb(200 27 58)). Critical alert state.

ps-success

#007A62

Success green — --color-role-text-success-light (rgb(0 122 98)). Confirmation surfaces.

ps-hint-pink

#CB2070

Hint / tooltip accent — --color-role-text-hint-light (rgb(203 32 112)). Used for the documented "hint" affordance on form fields.

Mode role mappings

Light mode (15 roles)

accent → ps-blue-link

accent-hover → ps-blue-active

background → paper

border → paper-divider

error → ps-warning

primary → ps-blue

primary-hover → ps-blue-hover

success → ps-success

surface → paper-surface

surface-elevated → paper

text-primary → ash-text

text-secondary → ash-secondary

text-tertiary → ash-tertiary

warning → ps-orange

warning-hover → ps-orange-active

Dark mode (15 roles)

accent → ps-blue-bright

accent-hover → ps-blue

background → ink

border → ink-divider

error → ps-warning

primary → ps-blue

primary-hover → ps-blue-bright

success → ps-success

surface → ink-surface

surface-elevated → ink-surface-high

text-primary → paper

text-secondary → ash-secondary-dark

text-tertiary → ash-secondary

warning → ps-orange

warning-hover → ps-orange-active

Provenance

Source: https://www.playstation.com/
Attribution: Sony Interactive Entertainment LLC — palette values captured from the deployed stylesheet on playstation.com (--color-N-*, --color-role-* design-token families, including the --color-role-section-gradients-blue-start / blue-end and --color-role-backgrounds-primary-link-* token clusters). PlayStation, the PlayStation family-mark logos (PS1 / PS2 / PS3 / PS4 / PS5), PS Plus, DualSense, and associated marks are trademarks of Sony Interactive Entertainment LLC.
Imported: 2026-05-19
Notes: Derived from live site CSS at https://www.playstation.com/ on 2026-05-19; Sony Interactive Entertainment's published brand-guidelines documents (Style Guide for Licensees) are distributed under NDA via the DevNet partner portal and are not publicly accessible. The captured tokens come from the deployed design-system theme on the consumer site. The primary typeface is SST (proprietary, declared via --dk-font as "sst, Arial, sans-serif"), supplemented by Mont W05 (--dk-font-mont) and Bebas Neue (--dk-font-bebas-neue) on hero modules. This palette is paired with inter@1 as the open-source rendering substitute in the corresponding brand atom. PlayStation is a sub-brand of Sony (parent: sony@1) but stands on its own atom here because the visual identity is functionally independent.