PlayStation color palette
GamingPlayStation's color identity centers on a vivid blue primary, complemented by dark and neutral tones for a sleek, modern gaming interface. The palette is consistent across digital, hardware, and packaging applications.
playstation.comPlayStation colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- PlayStation BluePrimary0, 112, 209
- PlayStation Deep BlueSecondary0, 48, 135
- PlayStation WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- PlayStation CharcoalBackground24, 26, 27
- PlayStation Surface GraySurface35, 39, 42
- PlayStation Border GrayBorder58, 63, 68
Text
Three tiers of copy.- PlayStation Text WhiteText255, 255, 255
- PlayStation Text GraySecondary text181, 181, 181
- PlayStation Muted GrayMuted text138, 138, 138
Semantic
Feedback and state colors.- PlayStation Success GreenSuccess76, 175, 80
- PlayStation Warning YellowWarning255, 193, 7
- PlayStation Error RedError211, 47, 47
- PlayStation Info BlueInfo33, 150, 243
Use PlayStation's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
playstation-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #2196F3;
--error: #D32F2F;
--accent: #FFFFFF;
--border: #3A3F44;
--primary: #0070D1;
--success: #4CAF50;
--surface: #23272A;
--warning: #FFC107;
--secondary: #003087;
--text-muted: #8A8A8A;
--background: #181A1B;
--text-primary: #FFFFFF;
--text-secondary: #B5B5B5;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
17.5:1
Pass
Text on surface
Needs 4.5:1 for body text
15.1:1
Pass
Secondary text on background
Needs 4.5:1 for body text
8.5:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.3:1
Pass
Muted text on background
Needs 3:1 for large text
5.1:1
Pass
Muted text on surface
Needs 3:1 for large text
4.4:1
Pass
PlayStation gray, dark and neutral colors
PlayStation runs a dark interface, so these grays carry the layout: background, sidebar surfaces, dividers and three tiers of text. Click a value to copy it.
- PlayStation CharcoalBackground
- HEX
- RGB
- HSL
- PlayStation Surface GraySurface
- HEX
- RGB
- HSL
- PlayStation Border GrayBorder
- HEX
- RGB
- HSL
- PlayStation Text WhiteText
- HEX
- RGB
- HSL
- PlayStation Text GraySecondary text
- HEX
- RGB
- HSL
- PlayStation Muted GrayMuted text
- HEX
- RGB
- HSL
About PlayStation's colors
PlayStation's palette is anchored by a distinctive blue, evoking trust and innovation, balanced by dark neutrals for a premium, immersive feel. The supporting colors provide clarity and accessibility across interfaces.
Primary blue is complemented by deep blue and white for contrast.
Dark backgrounds enhance the vibrancy of blue and white elements.
Accent and semantic colors are used sparingly for clarity and feedback.
Psychology
Blue conveys reliability, technology, and a sense of calm, aligning with PlayStation's brand values. Dark neutrals create a cinematic, focused environment for gaming.
Evolution
The blue primary has been consistent since the PlayStation 2 era, with minor adjustments in shade. The dark UI and gray tones became more prominent with the PlayStation 4 and 5 interfaces.
Where PlayStation uses each color
- Primary
Used for the PlayStation logo, key buttons, and major navigation highlights.
- Secondary
Appears in backgrounds, overlays, and select UI elements for depth.
- Accent
Used for text, icons, and high-contrast elements on dark backgrounds.
- Backgrounds
Dominates app screens, dashboard, and hardware packaging.
- Text
White and gray tones are used for primary and secondary text throughout the interface.
- Semantic
Green, yellow, and red are used for success, warning, and error states in notifications and system messages.
PlayStation color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official PlayStation primary color is #0070D1, known as PlayStation Blue. This color is used for the logo and key branding elements.
PlayStation Blue (#0070D1) is RGB(0, 112, 209) and CMYK(100, 46, 0, 18). Use these for accurate reproduction in digital and print.
PlayStation uses #181A1B (PlayStation Charcoal) for backgrounds and #23272A (PlayStation Surface Gray) for surfaces. These dark tones are prominent in the UI and hardware design.
Use #0070D1 for primary branding, with dark neutrals for backgrounds and white or gray for text. Semantic colors like #4CAF50 (success) and #D32F2F (error) are reserved for status indicators.
The secondary color is PlayStation Deep Blue, #003087, and the accent is PlayStation White, #FFFFFF. Together with the primary they make up the three brand colors at the top of this page.
6 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies PlayStation's colors consistently when it generates UI.
Make something in the spirit of PlayStation
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.