Skip to content

Navy #000080

Authority that doesn’t shout.

RGB
0, 0, 128
HSL
240°, 100%, 25%
CMYK
100, 100, 0, 50
Luminance
0.0156

About Navy

Navy, #000080, is blue with the lights dimmed to seriousness — the color of uniforms, institutions and every suit that ever wanted to be trusted. It functions as a “chromatic black”: dark enough to ground a layout, blue enough to feel alive.

History

Named for the British Royal Navy’s 1748 uniform, navy is indigo’s institutional descendant — the same dye family that colored workwear denim colored the world’s fleets, police forces, and school uniforms. It is arguably the most-worn color in human history.

Psychology

Navy scores like blue — trust, competence, stability — but adds gravitas and tradition. It is the safest formal color in existence: no interview, courtroom or pitch deck was ever lost for wearing it.

In design

Navy is the premium alternative to black canvases: #0f172a-class darks are the backbone of modern dashboards (this hub included). White and gold text sit beautifully on it; pure #000080 backgrounds want lighter text than AA-minimum — aim high. Pair with crisp white (nautical), gold (heritage), coral or amber (modern contrast).

In culture

Navy is nautical stripes and blazers, old money’s favorite color, and half of the most reproduced flag palette on Earth (navy-white-red). “Navy blue” is one of the few color names that carries an institution inside it.

Brands that own navy

Shades of navy

Every format

HEX#000080
RGBrgb(0, 0, 128)
HSLhsl(240, 100%, 25%)
CMYKcmyk(100%, 100%, 0%, 50%)
LABlab(13.0 47.5 -64.7)
LCHlch(13.0 80.3 306.3)
OKLCHoklch(0.271 0.188 264.1)

Copy-ready code

/* CSS */
color: #000080;
background-color: #000080;
/* Tailwind (arbitrary) */
class="text-[#000080] bg-[#000080]"
/* SCSS */
$brand: #000080;
/* SwiftUI */
Color(red: 0.000, green: 0.000, blue: 0.502)
/* Android */
Color.parseColor("#000080")

Accessibility — WCAG contrast

Aa
#000080 on white: 16.01:1
AA ✓ pass · AA-large · AAA
Aa
#000080 on black: 1.31:1
AA ✗ fail · AA-large · AAA
true color
protanopia
deuteranopia
tritanopia

RGB percentages

Red0.0%
Green0.0%
Blue50.2%

CMYK percentages

Cyan100.0%
Magenta100.0%
Yellow0.0%
Key (black)49.8%

Color previews

#000080 text on a black background

contrast 1.31:1

Card sample

#000080 text on a white background

contrast 16.01:1

Card sample

CSS3 live lab

Text font color

The quick brown fox

color: #000080;
Background color
Panel with #000080 background
background-color: #000080;
Text shadow — hex

Glowing headline

text-shadow: 2px 2px 8px #000080;
Text shadow — RGB

Soft neon halo

text-shadow: 0 0 14px rgba(0, 0, 128, 0.45);
Div box shadow
Elevated card
box-shadow: 0 12px 32px -8px rgba(0, 0, 128, 0.45);
Border & gradient
Gradient panel
border: 3px solid #000080;
background: linear-gradient(135deg, #000080, #550080);

Monochromatic scale

Palettes built from #000080

Shades — darker

Tints — lighter

Hue & tone neighbors

Color harmonies

Nearest named colors

Navy, answered

What is the hex code for navy blue?

CSS navy is #000080. Popular design navies include midnight #191970, Oxford #002147 and the dashboard staple #0f172a.

Is navy better than black for interfaces?

Often — navy darks keep depth and temperature where pure black can feel void-like, and colored accents glow more naturally on them. Most “dark modes” are actually navy-tinted.

What colors go with navy?

White (nautical crispness), gold (heritage), coral, amber and pink (modern energy), and gray for corporate calm. Navy plays the neutral in all of them.

Work with #000080 in the Color Lab