Cerulean Blue (#007BA7) — Color Codes, Meaning & UI Palettes
Cerulean Blue (#007BA7) comes from the Latin caeruleus (heaven/sky), representing a rich sky-blue pigment celebrated in fine art and popularized as Pantone's inaugural Color of the Millennium in 2000. It conveys stability, infinite horizons, and clarity.
#007BA7. In RGB, it is rgb(0, 123, 167). In HSL, it is hsl(196deg, 100%, 33%), and its print CMYK formulation is cmyk(100%, 26%, 0%, 35%). It has a relative luminance of 0.17 and pairs best in UI design with Pure White (#FFFFFF) and Coral Reef (#FF6B6B).
WCAG 2.1 Accessibility & Contrast Rating
11-Step Tints & Shades Scale (Tailwind 50–950)
Mathematically balanced luminance scale for design tokens and CSS color palettes. Click any shade to copy hex code:
Color Harmonies & Palette Schemes
Complementary
Analogous -30°
Analogous +30°
Triadic +120°
Triadic +240°
Curated UI Design Pairings for Cerulean Blue
Ideal primary brand color for cloud infrastructure, marine conservation, travel portals, and productivity suites.
Export Cerulean Blue Code Snippets
--color-cerulean-blue: #007BA7;
'cerulean-blue': '#007BA7'
Color(hex: "#007BA7")
{"name": "Cerulean Blue", "hex": "#007BA7"}
Frequently Asked Questions About Cerulean Blue (#007BA7)
What is the exact HEX code for Cerulean Blue?
The exact HEX code for Cerulean Blue is #007BA7. In 8-digit hexadecimal (with 100% opacity), it is #007BA7FF. Its RGB decimal equivalent is rgb(0, 123, 167) and its HSL value is hsl(196deg, 100%, 33%).
What colors go best with Cerulean Blue in UI and web design?
Cerulean Blue pairs exceptionally well with Pure White (#FFFFFF), Coral Reef (#FF6B6B), Deep Abyssal Blue (#06283D), and Pale Sea Mist (#DFF6FF).
How do I use Cerulean Blue in CSS and Tailwind CSS?
In standard CSS, apply it directly via color: #007BA7; or background-color: #007BA7;. In Tailwind CSS, use arbitrary value syntax like bg-[#007ba7] or text-[#007ba7], or define it in your Tailwind v4 @theme block as --color-cerulean-blue: #007BA7;.
Is Cerulean Blue WCAG accessible for readable text?
Against a pure white background (#FFFFFF), Cerulean Blue achieves a contrast ratio of 4.77:1 (AA). Against a pure black background (#000000), it achieves 4.4:1 (AA Large). Check custom contrast pairings on Pikka's WCAG Contrast Checker.
Explore More Colors in the Dictionary
Browse our complete catalog of curated named colors, harmonic palettes, and accessible UI combinations.