Sapphire

#304DA6

General Information about Sapphire (#304DA6)

The hex color code #304DA6 represents a shade of blue known as Sapphire. This color is located in the blue-violet spectrum, combining elements of both blue and purple. In the RGB color model, #304DA6 is composed of 19.6% red, 30.2% green, and 65.1% blue. In the CMYK color model, it consists of 70% cyan, 54% magenta, 0% yellow, and 35% black. Sapphire blue is often associated with qualities like trust, intelligence, loyalty, wisdom, confidence, stability and heaven. The color name Sapphire comes from the precious gemstone, which exhibits similar shades of blue.

The accessibility of #304DA6 (Sapphire) needs careful consideration in web design. With a luminance value of approximately 0.15, it falls into the darker range, implying that using it as a background color requires light text for sufficient contrast. According to WCAG guidelines, this color alone will likely fail contrast checks for normal-sized text (4.5:1 contrast ratio) and may even struggle with large text (3:1 contrast ratio). To ensure readability and usability, especially for users with visual impairments, pairing #304DA6 with lighter hues like white (#FFFFFF) or very light yellows or greens is crucial. If used for interactive elements, consider providing clear visual cues beyond just color to meet WCAG 2.1 success criteria.

Shades

Digital Color Formats

RGB
48 77 166
RGB48 77 166
Red
Green
Blue
HSL
225.25deg 55.14% 41.96%
225.2555.1441.96HSL
Hue
Saturation
Lightness
HWB
225.25deg 18.82% 34.9%
225.2518.8234.9HWB
Hue
Whiteness
Blackness
hex#304DA6
rgb48 77 166
hsl225.25deg 55.14% 41.96%
cmyk71.08% 53.61% 0% 34.9%
hwb225.25deg 18.82% 34.9%
xyz-d650.11 0.09 0.37
oklch0.4503 0.1476 266.77
oklab0.4503 -0.01 -0.15
CMYK
71.08% 53.61% 0% 34.9%
71.0853.61034.9CMYK
Cyan
Magenta
Yellow
Key
XYZ-d65
0.11 0.09 0.37
0.110.090.37XYZ
X
Y
Z
OKLCH
0.4503 0.1476 266.77
0.45030.1476266.77LCH
Lightness
Chroma
Hue
OKLAB
0.4503 -0.01 -0.15
0.4503-0.01-0.15LAB
Lightness
Green-Red
Blue-Yellow

Alternative colors

Applications

Complementary color

Buttons