Color Directory
Navy
The deep blue of naval uniforms — the classic serious, trustworthy dark blue.
#000080
- HEX
- #000080
- RGB
- rgb(0, 0, 128)
- HSL
- hsl(240, 100%, 25%)
Check Navy
Contrast ratios against white and black text.
WCAG asks for 4.5:1 on body text and 3:1 on text 24px or larger. Ratios are calculated from #000080 in the sRGB colour space.
About this entry
What it is
The deep blue of naval uniforms — the classic serious, trustworthy dark blue.
Corporate identities, headers and text that needs weight without going black.
Copy & use
How to copy and use navy
- 01
Copy the complete value
Use the copy button above so the value is captured without its label, description or surrounding page text.
- 02
Paste it where you need it
Corporate identities, headers and text that needs weight without going black.
- 03
Check the final result
Modern browsers support hex, RGB and HSL. Screens, colour profiles and neighbouring colours can still make the same value appear different, so evaluate it in the intended interface.
Tints & shades
A scale built from navy
Each step is mixed toward white or black from #000080 in sRGB, which is what the browser does too. Useful when one colour has to cover hover states, borders and backgrounds as well as the accent itself.
Lighter 60%
#9999CC
rgb(153, 153, 204)
Lighter 30%
#4D4DA6
rgb(77, 77, 166)
- Base
Base
#000080
rgb(0, 0, 128)
Darker 30%
#00005A
rgb(0, 0, 90)
Darker 60%
#000033
rgb(0, 0, 51)
Name & pairing
Where navy comes from
Named for the British Royal Navy uniform adopted in the eighteenth century. The hex here is the CSS keyword value, which is a pure blue at quarter brightness rather than the slightly desaturated navy most brands actually use.
What to put beside it
Takes white text comfortably and gold or brass as an accent. Against black it loses its blueness entirely, so give it a lighter ground if you want the colour to read.
Common questions
Using navy
What is navy?
The deep blue of naval uniforms — the classic serious, trustworthy dark blue. Corporate identities, headers and text that needs weight without going black.
What are the colour values for Navy?
Navy is HEX #000080, RGB rgb(0, 0, 128), HSL hsl(240, 100%, 25%). All three notations describe the same sRGB colour, so pick whichever your tool expects: hex for CSS and design files, RGB when you need the channels separately, HSL when you want to shift lightness or saturation without changing the hue.
Will navy work everywhere?
Modern browsers support hex, RGB and HSL. Screens, colour profiles and neighbouring colours can still make the same value appear different, so evaluate it in the intended interface.
Can I customise navy after copying?
Use the supplied value as a starting point, then check contrast and nearby colours in the final design. Converting between hex, RGB and HSL does not change the intended sRGB colour.
Also known as
Keep browsing