Maroon Colors  ·  Color Library

Palettes / Colors / #CAEFF2

#CAEFF2 — Pale Teal

#CAEFF2 is a teal color we call Pale Teal, closest to the named color PaleTurquoise (#AFEEEE). It belongs to the teal family.

Color name

Closest CSS keyword: paleturquoise (#AFEEEE) — not an exact match. CSS paleturquoise gives you #AFEEEE, a different color; use #CAEFF2 when you need this exact shade.

Sources: common names follow widely used color-name references; CSS keywords and their hex values follow the CSS Color specification.

#CAEFF2 is a cool teal color associated with freshness, clarity and balance. It is light enough to work as a background or base color, with darker text on top.

Its strongest partner is its complement #F2CCCA; it also sits naturally between #CAF2E1 and #CADBF2. In the palettes below you can see it working alongside real color combinations from our collection.

#CAEFF2 · RGB 202, 239, 242

Download PNG swatch SVG

Color values

HEX#CAEFF2
RGB202, 239, 242
HSL184°, 61%, 87%
HSV184°, 17%, 95%
CMYK17%, 1%, 0%, 5%
XYZ71.25, 80.70, 95.83
Yxy80.70, 0.2876, 0.3257
CIE-Lab92.00, -11.30, -5.46
Hunter Lab89.83, -11.01, -5.45

RGB & CMYK percentages

Red 79% · Green 94% · Blue 95%

Cyan 17% · Magenta 1% · Yellow 0% · Key 5%

CMYK values are unprofiled approximations for screen reference — not a print-proofing guarantee.

Previews

Sample text in #CAEFF2 on black
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sample text in #CAEFF2 on white
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

CSS code for #CAEFF2

.text { color: #CAEFF2; }
.background { background-color: #CAEFF2; }
.border { border: 3px solid #CAEFF2; }
.text-rgb { color: rgb(202, 239, 242); }
.text-hsl { color: hsl(184, 61%, 87%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #CAEFF2; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(202, 239, 242, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #CAEFF2; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(202, 239, 242, 0.8); }

HTML: <p style="color:#CAEFF2">Text here</p> · <div style="background-color:#CAEFF2">Div content here</div>

Shades of #CAEFF2

#A9E6EA#84DBE1#63D1D9#42C8D1#2EB3BD#259098#1D7177#155256#0C2F31#041010

Tints of #CAEFF2

#CEF1F3#D2F2F4#D6F3F5#DAF4F6#DEF5F7#DEF5F7#E2F7F8#E6F8F9#EAF9FA#EFFAFB

Tones of #CAEFF2

#CDEDEF#CFEAEC#D2E8E9#D5E5E6#D8E3E3#DBE0E1

Color harmonies

Complementary — #F2CCCA:

Analogous:

Triadic:

Contrast & accessibility

Against white text1.23:1 Fails
Against black text17.14:1 AAA

Best text color on #CAEFF2: #000000.

Semi-transparent (opacity) text on #CAEFF2

Text set with opacity blends into the background, so its real contrast is lower than the solid ratios above. Choose a text color and an opacity to see the blended color and its true ratio:

100%
Sample heading text
Smaller body text shows the effect best.

Blended color: · Contrast against #CAEFF2: ·

How #CAEFF2 looks with color blindness

Simulated with standard Machado color-vision-deficiency matrices — useful when this color carries meaning in charts, maps or interfaces:

Protanopia · #DADAF1Deuteranopia · #D8D5F1Tritanopia · #CCF1F1

Closest design-system colors

The nearest matches in the Tailwind CSS, Material Design and Bootstrap palettes — handy when you need a framework class instead of a raw hex:

Bootstrap light · #F8F9FAMaterial Grey 500 · #9E9E9ETailwind purple 500 · #A855F7

Palettes with a similar color

These palettes use a close neighbour of #CAEFF2 rather than the exact color:

Radiant Twilight
#F3D0C8 · #F2F7D9 · #C7F2CD · #C8EFF3
Palette C8f0f0
#C8F0F0 · #86D8DC · #7047A3 · #3A276A
Vintage Ruby Mirage
#1EBBC8 · #DC20CE · #C5D21F · #C9ECF1
Palette E3fdfd
#E3FDFD · #CBF1F5 · #A6E3E9 · #71C9CE
Palette Ffe6eb
#FFE6EB · #DEFCFC · #CBF1F5 · #A6E3E9
Velvet Summit
#A01D13 · #EB7152 · #19CCDA · #C8F1F5

Similar colors

The closest colors that actually appear in our palette collection — click any to open its page:

#C8EFF3#C8F0F0#C9ECF1#CBF1F5#C8F1F5#CBEFEE#CCF2F4#CEECF0#CAEBEE#CEF0EE#CFECF3#CAF0F8

Browse neighbouring colors

← #CAEFF1  ·  #CAEFF3 →

Frequently asked questions

What color is #CAEFF2?

#CAEFF2 is Pale Teal, a teal color (RGB 202, 239, 242). Its closest standard named color is PaleTurquoise.

What is the RGB and HSL of #CAEFF2?

#CAEFF2 is RGB 202, 239, 242 — HSL 184°, 61%, 87% — CMYK 17%, 1%, 0%, 5%.

What colors go with #CAEFF2?

Its complement is #F2CCCA; analogous partners are #CAF2E1 and #CADBF2. It also appears in 6+ palettes in our collection.

Can I use #CAEFF2 for text?

Black text on #CAEFF2 has a contrast ratio of 17.14:1 (passes WCAG AA); white text gives 1.23:1.