Nikon color palette
ConsumerNikon's color identity is defined by its iconic yellow, paired with deep black and neutral grays for clarity and contrast. The palette is instantly recognizable and has remained consistent across brand touchpoints.
nikon.comNikon colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Nikon YellowPrimary255, 225, 0
- Nikon BlackSecondary0, 0, 0
- Nikon WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- Nikon Light GrayBackground245, 245, 245
- Nikon Medium GraySurface229, 229, 229
- Nikon Border GrayBorder204, 204, 204
Text
Three tiers of copy.- Nikon Text BlackText34, 34, 34
- Nikon Text GraySecondary text102, 102, 102
- Nikon Muted GrayMuted text153, 153, 153
Semantic
Feedback and state colors.- Nikon Success GreenSuccess75, 175, 79
- Nikon Warning OrangeWarning255, 184, 0
- Nikon Error RedError211, 47, 47
- Nikon Info BlueInfo25, 118, 210
Use Nikon's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
nikon-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #1976D2;
--error: #D32F2F;
--accent: #FFFFFF;
--border: #CCCCCC;
--primary: #FFE100;
--success: #4BAF4F;
--surface: #E5E5E5;
--warning: #FFB800;
--secondary: #000000;
--text-muted: #999999;
--background: #F5F5F5;
--text-primary: #222222;
--text-secondary: #666666;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
14.6:1
Pass
Text on surface
Needs 4.5:1 for body text
12.6:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.3:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.6:1
Pass
Muted text on background
Needs 3:1 for large text
2.6:1
Fail
Muted text on surface
Needs 3:1 for large text
2.3:1
Fail
Nikon gray and neutral colors
The quiet part of the Nikon palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Nikon Light GrayBackground
- HEX
- RGB
- HSL
- Nikon Medium GraySurface
- HEX
- RGB
- HSL
- Nikon Border GrayBorder
- HEX
- RGB
- HSL
- Nikon Text BlackText
- HEX
- RGB
- HSL
- Nikon Text GraySecondary text
- HEX
- RGB
- HSL
- Nikon Muted GrayMuted text
- HEX
- RGB
- HSL
About Nikon's colors
Nikon's palette uses high-contrast yellow and black for instant brand recognition and legibility. Neutral grays support the primary colors and provide balance in digital and print applications.
Primary yellow is paired with black for maximum contrast.
White and light gray are used for clean backgrounds.
Accent colors are reserved for status and UI feedback.
Psychology
The yellow evokes energy, optimism, and creativity, aligning with Nikon's focus on capturing moments. Black and gray convey professionalism and reliability.
Evolution
Nikon's color palette has remained largely unchanged for decades, maintaining strong brand consistency. Minor adjustments to gray tones have been made to optimize for digital readability.
Where Nikon uses each color
- Primary
Nikon Yellow is used in the logo, call-to-action buttons, and key highlights on packaging.
- Secondary
Nikon Black appears in navigation bars, product backgrounds, and typography.
- Accent
Nikon White is used for text on dark backgrounds and as a secondary background color.
- Backgrounds
Nikon Light Gray is the main background color for web pages and app screens.
- Text
Nikon Text Black and Text Gray are used for primary and secondary text, ensuring readability.
- Semantic
Success Green, Warning Orange, Error Red, and Info Blue are used for status indicators and alerts in digital interfaces.
Nikon color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Nikon primary color hex code is #FFE100. This yellow is used consistently across all brand materials.
Nikon Yellow (#FFE100) is RGB(255, 225, 0) and CMYK(0, 0, 100, 0). These values ensure accurate reproduction in both digital and print formats.
Nikon uses a range of grays, including Nikon Light Gray (#F5F5F5), Medium Gray (#E5E5E5), and Border Gray (#CCCCCC), to provide structure and readability in digital interfaces.
Use Nikon Yellow (#FFE100) for brand highlights and calls to action, with black and gray for backgrounds and text. Accent and semantic colors should be reserved for UI feedback and alerts.
The secondary color is Nikon Black, #000000, and the accent is Nikon White, #FFFFFF. 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 Nikon's colors consistently when it generates UI.
Make something in the spirit of Nikon
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.