Navy Color Code
Navy·#000080
Navy is the classic CSS named dark blue at #000080. It is denser, more formal, and more structural than Royal Blue or Steel Blue, which makes it useful when you need a trustworthy anchor color for headers, sidebars, enterprise navigation, and deep interface framing.
Tonal Scale
Contrast Checks
White text on this color
Buttons, badges, and filled actions.
Dark text on this color
Large headings and selective UI.
This color on light surface
Links, borders, and icons on light UI.
Professional Reference
Accessibility Matrix
White text on this color
White text placed on the current color.
Dark text on this color
Dark text or headings on the current color.
This color on light surface
Use this color for links, strokes, or icons on light UI.
This color on dark surface
Use this color inside dark shells for strokes, tags, or icons.
Where It Works
- Headers, side navigation, enterprise shells, and deep framing.
- Strong for structure and hierarchy, weaker for dark-on-dark small text.
- Pairs with white, silver or slate neutrals, and a brighter blue.
Reference Notes
Navy is sourced from the published CSS Standard Colors library and retained here as a searchable reference swatch for product and interface reference work.
Trust-building blues for enterprise and SaaS.
Related Colors
Palette Starting Points
Implementation Snippets
:root {
--color-navy: #000080;
--color-navy-rgb: 0 0 128;
}class="bg-[#000080] text-white"
class="hover:bg-[#00005C] ring-1 ring-[#000080]"{
"navy": "#000080",
"navyRgb": [0, 0, 128],
"navyHsl": [240, 100, 25]
}