White text 16.0:1
Navy blue is the darkest, most serious corner of the blue family.
This page lists 27 named shades of navy and dark blue - Oxford Blue, Prussian Blue, Midnight Blue, Space Cadet and more - with HEX, RGB, HSL and CMYK codes.
Every one of them works with white text. Copy a code or build a full navy scale below.
Lapis Lazuli - lightest27 shades sorted light to darkdarkest - Cetacean Blue
Download all 27 shades of navy blue
Photoshop, Illustrator, InDesign, AffinityA Tailwind-style scale built from Navy Blue (#000080), evenly spaced in OKLCH lightness. Paste any other navy blue to build its own scale, or click a swatch for its codes and contrast.
Something went wrong. Please try again.
Still having trouble? Please contact us and we'll be happy to help!
Hmm, that doesn't look like a color yet. Try #3399cc, rgb(51, 153, 204), hsl(200, 60%, 50%) or a name like Cobalt.
#000080rgb(0, 0, 128)hsl(240, 100%, 25%)cmyk(100%, 100%, 0%, 50%)Tints mixed with white
Shades mixed with black
Tones mixed with gray
Click any swatch to see its codes and contrast. Tints, shades and tones are simple RGB mixes, the classic way painters and print designers make them.
:root {
--brand-50: #f3f7fe;
--brand-100: #e0eafe;
--brand-200: #c4d8ff;
--brand-300: #a0bfff;
--brand-400: #719eff;
--brand-500: #4980ff;
--brand-600: #205dff;
--brand-700: #0036f9;
--brand-800: #002acd;
--brand-900: #0021aa;
--brand-950: #000080;
}Next: blend 50 into 950 in the Gradient Generator, test every pair in the Accessible Color Palette, check 900 on 100 with the Contrast Checker or find matching colors on the Color Wheel.
Using the same color wheel maths as our Color Wheel, these are the harmonies for Navy Blue (#000080). Click a group to open it on the wheel.
#808000 Olive Drab
Analogous
Next-door neighbors - calm and harmonious
#004080 Dark Cerulean#400080 Indigo
Triadic
Three evenly spaced hues - bold and balanced
#800000 Maroon#008000 Green
Split complementary
The two neighbors of the opposite - contrast with less tension
#804000 Chocolate#408000 Avocado
Navy blue feels trustworthy, professional and timeless. It is the color of suits, uniforms and school blazers, and a favorite of law firms, banks and universities.
The name comes from the uniforms of the British Royal Navy, which adopted a dark blue for officers in 1748.
Navy is often called the new black: it is dark enough for text and backgrounds but softer and warmer to look at than pure black.
See navy blue in complete, ready-made palettes - each one with codes and downloads.
Want a palette built around one exact navy blue? Start from it in the AI Color Palette Generator or pull colors from a photo with the Image Color Picker.
Navy Blue is #000080, which is rgb(0, 0, 128) and hsl(240, 100%, 25%). For print it is about 100% cyan, 100% magenta, 0% yellow and 50% black. It is also a CSS color keyword, so you can simply write navy in your stylesheet.
There is no fixed number - any navy blue can be made lighter, darker or more muted. This page lists 27 named shades, from Lapis Lazuli (#26619C) to Cetacean Blue (#001440). The generator on this page makes a full 50-950 scale and unlimited tints, shades and tones from any navy blue.
Navy Blue (#000080) has a contrast ratio of 16.00:1 on white, which passes WCAG AAA for normal text. On black it reaches 1.31:1, so use it as text on light backgrounds, or put white text on it. Test any pair with the Contrast Checker.
The standard navy is #000080 - pure blue at half strength, with no red or green. It is also a CSS named color: navy.
Navy (#000080) is a pure, saturated dark blue. Midnight Blue (#191970) has a touch of red and green mixed in, so it looks slightly softer and more purple.
In fashion and interiors, navy is often treated as a neutral because it goes with almost everything, like black or gray. It still adds more color and warmth than either.