Nintendo color palette
GamingNintendo's color identity centers on its iconic, vibrant red, paired with clean white and subtle gray tones for a bold, approachable look. The palette is consistent across products, packaging, and digital interfaces.
nintendo.comNintendo colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Nintendo RedPrimary230, 0, 18
- Nintendo WhiteSecondary255, 255, 255
- Nintendo GrayAccent140, 140, 140
Surfaces
Page, cards and dividers.- Nintendo Light GrayBackground245, 245, 245
- Nintendo Panel GraySurface237, 237, 237
- Nintendo Border GrayBorder209, 209, 209
Text
Three tiers of copy.- Nintendo CharcoalText26, 26, 26
- Nintendo Medium GraySecondary text84, 84, 84
- Nintendo Muted GrayMuted text160, 160, 160
Semantic
Feedback and state colors.- Nintendo Success GreenSuccess67, 176, 71
- Nintendo Warning YellowWarning255, 185, 0
- Nintendo Error RedError215, 0, 15
- Nintendo Info BlueInfo0, 153, 216
Use Nintendo's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
nintendo-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0099D8;
--error: #D7000F;
--accent: #8C8C8C;
--border: #D1D1D1;
--primary: #E60012;
--success: #43B047;
--surface: #EDEDED;
--warning: #FFB900;
--secondary: #FFFFFF;
--text-muted: #A0A0A0;
--background: #F5F5F5;
--text-primary: #1A1A1A;
--text-secondary: #545454;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
16.0:1
Pass
Text on surface
Needs 4.5:1 for body text
14.9:1
Pass
Secondary text on background
Needs 4.5:1 for body text
6.9:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
6.5:1
Pass
Muted text on background
Needs 3:1 for large text
2.4:1
Fail
Muted text on surface
Needs 3:1 for large text
2.2:1
Fail
Nintendo gray and neutral colors
The quiet part of the Nintendo palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Nintendo Light GrayBackground
- HEX
- RGB
- HSL
- Nintendo Panel GraySurface
- HEX
- RGB
- HSL
- Nintendo Border GrayBorder
- HEX
- RGB
- HSL
- Nintendo CharcoalText
- HEX
- RGB
- HSL
- Nintendo Medium GraySecondary text
- HEX
- RGB
- HSL
- Nintendo Muted GrayMuted text
- HEX
- RGB
- HSL
About Nintendo's colors
Nintendo's palette is built around a vivid red, symbolizing energy and excitement, complemented by neutral whites and grays for clarity and accessibility. The color system is simple, direct, and instantly recognizable.
Primary red is paired with white for strong contrast.
Grays are used to support and balance the bold red.
Accent colors are reserved for status and UI feedback.
Psychology
Nintendo Red evokes excitement, passion, and playfulness, aligning with the brand's focus on fun and entertainment. The use of white and gray ensures approachability and clarity in communication.
Evolution
Nintendo's red has remained consistent since the early 2000s, solidifying brand recognition. The supporting palette has shifted toward lighter, more neutral grays for modern digital interfaces.
Where Nintendo uses each color
- Primary
Nintendo Red is used for logos, primary buttons, and key call-to-actions on web and packaging.
- Secondary
Nintendo White appears as the main background and in the logo for contrast.
- Accent
Nintendo Gray is used for navigation elements, UI icons, and secondary buttons.
- Backgrounds
Nintendo Light Gray and Panel Gray are used for app and website backgrounds and panels.
- Text
Nintendo Charcoal and Medium Gray are used for primary and secondary text, with Muted Gray for disabled or less prominent text.
- Semantic
Success Green, Warning Yellow, Error Red, and Info Blue are used for status indicators, alerts, and notifications.
Nintendo color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Nintendo brand color is Nintendo Red, with the hex code #E60012.
Nintendo Red is RGB(230, 0, 18) and CMYK(0, 100, 92, 0), corresponding to hex #E60012.
Nintendo uses several grays in its UI, including Nintendo Gray (#8C8C8C), Light Gray (#F5F5F5), and Panel Gray (#EDEDED) for backgrounds and interface elements.
Nintendo Red (#E60012) should be reserved for key branding and primary actions, while grays and whites provide structure and readability throughout digital and print materials.
The secondary color is Nintendo White, #FFFFFF, and the accent is Nintendo Gray, #8C8C8C. Together with the primary they make up the three brand colors at the top of this page.
4 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 Nintendo's colors consistently when it generates UI.
Make something in the spirit of Nintendo
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.