Azure

#007FFF

What color is Azure?

Azure is a bright, vivid blue, hex #007FFF, close to the color of a clear midday sky. It is lighter than navy but more saturated than a pale sky blue, with a clean, cool tone and no visible green or purple shift.

What is the meaning of the color Azure?

The name comes from the Old French word azur, borrowed from the Arabic lazaward, referring to lapis lazuli, the deep blue stone traded from mines in Badakhshan, Afghanistan, into medieval Europe. By the 13th century, the term appeared in English heraldry, where azure named the blue field on coats of arms and was governed by strict rules in blazon, the formal language of heraldic description. The color spread beyond heraldry into art, where painters used ground lapis lazuli as a pigment before synthetic alternatives became available in the 18th century. Microsoft adopted Azure as the name for its cloud computing platform, launched in 2010, anchoring the color firmly to technology and digital infrastructure.

RGB
0, 127, 255
HSL
210°, 100%, 50%
CMYK
100, 50, 0, 0
HSV
210°, 100%, 100%
Azure color

What colors go with Azure?

Colors that pair well with Azure include:
White: clean, open contrast
Navy: deep tonal anchor
Gold: warm, rich contrast
Silver: cool, polished balance
Coral: soft, warm complement

Similar Colors

Conversions & Codes

Format Value CSS
HEX #007FFF color: #007FFF;
RGB 0, 127, 255 color: rgb(0, 127, 255);
RGB Percentage 0%, 50%, 100% color: rgb(0%, 50%, 100%);
CMYK 100%, 50%, 0%, 0% Not supported in CSS
HSL 210°, 100%, 50% color: hsl(210, 100%, 50%);
HSV 210°, 100%, 100% Not supported in CSS
CIE-LAB 40, -25, -43 color: lab(40% -25 -43);
Decimal 32767 Not supported in CSS

Color Variations

Shades

#0080FF
#0073E6
#0066CC
#0059B3
#004C99
#004080
#003366
#00264D

Tints

#B3D9FF
#99CCFF
#80BFFF
#66B3FF
#4DA6FF
#3399FF
#1A8CFF
#0080FF

Tones

#0080FF
#0D80F2
#1A80E6
#2680D9
#3380CC
#4080BF
#4D80B3
#5980A6

Hues

#0080FF
#4000FF
#FF00FF
#FF0040
#FF8000
#BFFF00
#00FF00
#00FFBF

Color Harmonies

Analogous

#00FFFF
Click to copy
100%
#007FFF
Click to copy
100%
#0000FF
Click to copy
100%

Complementary

#007FFF
Click to copy
100%
#FF8000
Click to copy

Split Complementary

#007FFF
Click to copy
100%
#FF0000
Click to copy
98%
#FFFF00
Click to copy

Triadic

#007FFF
Click to copy
100%
#FF0080
Click to copy
98%
#80FF00
Click to copy

Tetradic

#007FFF
Click to copy
100%
#FF00FF
Click to copy
#FF8000
Click to copy
#00FF00
Click to copy
100%

Square

#007FFF
Click to copy
100%
#FF00FF
Click to copy
#FF8000
Click to copy
#00FF00
Click to copy
100%

CSS & Dev Snippets

CSS
.azure {
  color: #007FFF;
}
SCSS
$azure: #007FFF;
RGB
rgb(0, 127, 255)

Accessibility & Contrast

White background

3.83:1
3.83
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

5.48:1
5.48
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags