ع

Azure

أزوري فاتح

Color codes

HEX
RGB
HSL
HSV
CMYK (approximate)
CIELAB
CSS
Relative luminance0.9727
Cyan & Teal CSS Named ColorsPastel ColorsCool Colors Cool

Shades of Azure

All shades

Lighter

Darker

Tints mixed with white

Tones mixed with gray

Color harmonies

Complementary

Opposite on the wheel (180°): maximum contrast for accents.

Export
Analogous

Neighbors 30° apart: calm and natural.

Export
Triadic

Three hues 120° apart: vibrant yet balanced.

Export
Split-complementary

The base plus the two neighbors of its complement: contrast with less tension.

Export
Tetradic

Four hues 90° apart: rich, best with one dominant color.

Export
Monochromatic

One hue in several lightness levels: elegant and consistent.

Export

Contrast and readability

White text1.03:1
✗ AA✗ AAA✗ AA Large
Black text20.45:1
✓ AA✓ AAA✓ AA Large
On white1.03:1
✗ AA✗ AAA✗ AA Large
On black18.39:1
✓ AA✓ AAA✓ AA Large

Text colors that pass AA

Check in the contrast checker

In a design

Plan your next project

A short paragraph shows how body text sits next to the color.

Get started Learn more
New

Cards and badges use a soft tint of the color. Read more

Plan your next project

A short paragraph shows how body text sits next to the color.

Get started
New

Cards and badges use a soft tint of the color.

Azure

Full-color background with readable text.

Get started

About Azure

Azure (#F0FFFF) is a very light, highly saturated color from the Cyan & Teal family with a cool character. It is made of 240 red, 255 green and 255 blue (hsl(180, 100%, 97%)). Its contrast ratio is 1.03:1 against white and 20.45:1 against black, so dark text reads best on it.

Suggested uses

  • page and card backgrounds
  • walls in bright, airy rooms
  • calm, trustworthy or technical themes

Reading the codes

In HEX, #F0FFFF stores red, green and blue as pairs of base-16 digits: 240, 255 and 255 out of 255. In HSL the same color has a hue of 180°, 100% saturation and 97% lightness, which makes lighter or darker variants easy to create by changing only the lightness.

Similar colors

#F5FFFAMint Cream#E0FFFFLight Cyan#F0F8FFAlice Blue#F4F8FBCool White#FFFFFFWhite#F5F5F5White Smoke#F0FFF0Honeydew#FAF9F6Off White#F5F5F7Surface Gray#D6E8F5Sky Mist

Palettes with this color

Healthcare Calm#0F4C5C #2A9D8F #8ECAE6 #E9F5F2 #FFFFFFCoastal Living#FFFFFF #E8F1F2 #A7C7CB #4F7D87 #D9C4A5Concrete and Coral#2B2D42 #8D99AE #EDF2F4 #EF233C #D90429Mint Gelato#E3F9F1 #B8F2E6 #AED9E0 #FFA69E #5E6472

Tools for this color

Shades GeneratorGenerate tints, tones, lighter and darker shades and saturation variations.Contrast CheckerAccurate WCAG contrast ratio with AA/AAA results and accessible suggestions.Color Harmony GeneratorComplementary, analogous, triadic, tetradic, split-complementary and monochromatic harmonies.Color Blindness SimulatorApproximate protanopia, deuteranopia, tritanopia and achromatopsia simulations.

Frequently asked questions

What is the HEX code of Azure?
The HEX code of Azure is #F0FFFF. In RGB it is rgb(240, 255, 255) and in HSL hsl(180, 100%, 97%).
Which text color works on Azure?
White text has a contrast ratio of 1.03:1 on Azure and black text 20.45:1, so black text is more readable. WCAG AA needs at least 4.5:1 for normal text.
What is the complementary color of Azure?
Rotating the hue of Azure by 180° gives #FFF0F0, its complementary color on the RGB color wheel.
What is Azure in CMYK?
An approximate CMYK value for Azure is cmyk(6%, 0%, 0%, 0%). For printing, ask your printer for an ICC-profiled conversion.