Nikkei color palette
MediaNikkei's brand color system is built around a distinctive deep blue, reflecting its authority and heritage as a leading Japanese media company. The palette is minimal, relying on blue, white, and a range of neutral grays for clarity and professionalism.
nikkei.comNikkei colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Nikkei BluePrimary0, 51, 102
- Nikkei Deep BlueSecondary0, 91, 172
- Nikkei Accent BlueAccent0, 113, 193
Surfaces
Page, cards and dividers.- Nikkei WhiteBackground255, 255, 255
- Nikkei Light GraySurface246, 246, 246
- Nikkei Border GrayBorder213, 213, 213
Text
Three tiers of copy.- Nikkei CharcoalText34, 34, 34
- Nikkei Medium GraySecondary text85, 85, 85
- Nikkei Muted GrayMuted text136, 136, 136
Semantic
Feedback and state colors.- Nikkei GreenSuccess0, 135, 59
- Nikkei YellowWarning255, 180, 0
- Nikkei RedError215, 38, 56
- Nikkei Info BlueInfo0, 113, 193
Use Nikkei's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
nikkei-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0071C1;
--error: #D72638;
--accent: #0071C1;
--border: #D5D5D5;
--primary: #003366;
--success: #00873B;
--surface: #F6F6F6;
--warning: #FFB400;
--secondary: #005BAC;
--text-muted: #888888;
--background: #FFFFFF;
--text-primary: #222222;
--text-secondary: #555555;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
15.9:1
Pass
Text on surface
Needs 4.5:1 for body text
14.7:1
Pass
Secondary text on background
Needs 4.5:1 for body text
7.5:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
6.9:1
Pass
Muted text on background
Needs 3:1 for large text
3.5:1
Pass
Muted text on surface
Needs 3:1 for large text
3.3:1
Pass
Nikkei gray and neutral colors
The quiet part of the Nikkei palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Nikkei WhiteBackground
- HEX
- RGB
- HSL
- Nikkei Light GraySurface
- HEX
- RGB
- HSL
- Nikkei Border GrayBorder
- HEX
- RGB
- HSL
- Nikkei CharcoalText
- HEX
- RGB
- HSL
- Nikkei Medium GraySecondary text
- HEX
- RGB
- HSL
- Nikkei Muted GrayMuted text
- HEX
- RGB
- HSL
About Nikkei's colors
Nikkei's palette is anchored by a deep blue, conveying trust and professionalism, complemented by clean whites and neutral grays for readability. Accent colors are used sparingly for functional UI elements and status indicators.
Primary blue contrasts with white backgrounds for strong brand presence.
Neutral grays provide structure and hierarchy in UI.
Accent blue and semantic colors highlight actions and statuses.
Psychology
Blue is associated with reliability, intelligence, and stability, aligning with Nikkei's reputation as a trusted news source. The restrained use of color supports clarity and seriousness.
Evolution
Nikkei's core blue has remained consistent over time, reinforcing brand recognition. The supporting palette has evolved subtly to improve digital accessibility and modernize the interface.
Where Nikkei uses each color
- Primary
Used in the Nikkei logo, navigation bar, and key headlines.
- Secondary
Appears in links, hover states, and section dividers.
- Accent
Highlights buttons, active UI elements, and notifications.
- Backgrounds
White and light gray backgrounds are used for content areas and cards.
- Text
Charcoal and medium gray are used for primary and secondary text throughout the site.
- Semantic
Green, yellow, and red indicate success, warning, and error states in data visualizations and alerts.
Nikkei color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Nikkei brand color is Nikkei Blue, hex code #003366.
Nikkei Blue (#003366) in RGB is (0, 51, 102); in CMYK it is (100, 50, 0, 60).
Nikkei uses a range of grays for UI and text: Nikkei Light Gray (#F6F6F6), Border Gray (#D5D5D5), Charcoal (#222222), Medium Gray (#555555), and Muted Gray (#888888).
Use Nikkei Blue (#003366) for brand elements and navigation, with neutral grays and white for backgrounds and text. Accent and semantic colors should be reserved for interactive elements and status indicators.
The secondary color is Nikkei Deep Blue, #005BAC, and the accent is Nikkei Accent Blue, #0071C1. 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 Nikkei's colors consistently when it generates UI.
Make something in the spirit of Nikkei
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.