Maroon Colors  ·  Color Library

Palettes / Colors / #CFE2DF

#CFE2DF — Pale Dusty Teal

#CFE2DF is a teal color we call Pale Dusty Teal, closest to the named color Gainsboro (#DCDCDC). It belongs to the teal family.

Color name

Closest CSS keyword: gainsboro (#DCDCDC) — not an exact match. CSS gainsboro gives you #DCDCDC, a different color; use #CFE2DF 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.

#CFE2DF 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 #E2CFD2; it also sits naturally between #CFE2D6 and #CFDCE2. In the palettes below you can see it working alongside real color combinations from our collection.

#CFE2DF · RGB 207, 226, 223

Download PNG swatch SVG

Color values

HEX#CFE2DF
RGB207, 226, 223
HSL171°, 25%, 85%
HSV171°, 8%, 89%
CMYK8%, 0%, 1%, 11%
XYZ66.25, 72.99, 80.41
Yxy72.99, 0.3016, 0.3323
CIE-Lab88.44, -6.86, -0.71
Hunter Lab85.43, -6.63, -0.68

RGB & CMYK percentages

Red 81% · Green 89% · Blue 87%

Cyan 8% · Magenta 0% · Yellow 1% · Key 11%

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

Previews

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

CSS code for #CFE2DF

.text { color: #CFE2DF; }
.background { background-color: #CFE2DF; }
.border { border: 3px solid #CFE2DF; }
.text-rgb { color: rgb(207, 226, 223); }
.text-hsl { color: hsl(171, 25%, 85%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #CFE2DF; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(207, 226, 223, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #CFE2DF; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(207, 226, 223, 0.8); }

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

Shades of #CFE2DF

#B6D3CF#9CC4BE#83B4AD#69A59C#568F87#45736C#365954#26403C#172624#080D0C

Tints of #CFE2DF

#D2E4E2#D6E6E4#D9E8E6#DCEAE8#E2EEEC#E6F0EE#E9F2F0#ECF4F2#EFF5F4#F2F7F7

Tones of #CFE2DF

#D1E1DE#D2E0DE#D3DEDC#D5DDDC#D6DBDB#D7DADA

Color harmonies

Complementary — #E2CFD2:

Analogous:

Triadic:

Contrast & accessibility

Against white text1.35:1 Fails
Against black text15.60:1 AAA

Best text color on #CFE2DF: #000000.

Semi-transparent (opacity) text on #CFE2DF

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 #CFE2DF: ·

How #CFE2DF looks with color blindness

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

Protanopia · #D7D7E0Deuteranopia · #D6D5E0Tritanopia · #D0E0E0

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 #CFE2DF rather than the exact color:

Palette 2c3333
#2C3333 · #2E4F4F · #0E8388 · #CBE4DE
Palette Fcd1d1
#FCD1D1 · #ECE2E1 · #D3E0DC · #AEE1E1
Palette D3dedc
#D3DEDC · #92A9BD · #7C99AC · #FFEFEF
Serene Ruby Horizon
#237953 · #9A57CF · #B57B34 · #CEEAE1
Crystal Cascade
#389589 · #B967C6 · #C3B55F · #D4E8E2
Palette 3368a0
#3368A0 · #66A3BF · #C8DFDB · #F2EFE7

Similar colors

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

#CBE4DE#D3E0DC#D3DEDC#CEEAE1#D4E8E2#C8DFDB#D0E7E6#CDE8E5#CDEADB#D6E4E5#CBEBDD#D6E8DB

Browse neighbouring colors

← #CFE2DE  ·  #CFE2E0 →

Frequently asked questions

What color is #CFE2DF?

#CFE2DF is Pale Dusty Teal, a teal color (RGB 207, 226, 223). Its closest standard named color is Gainsboro.

What is the RGB and HSL of #CFE2DF?

#CFE2DF is RGB 207, 226, 223 — HSL 171°, 25%, 85% — CMYK 8%, 0%, 1%, 11%.

What colors go with #CFE2DF?

Its complement is #E2CFD2; analogous partners are #CFE2D6 and #CFDCE2. It also appears in 6+ palettes in our collection.

Can I use #CFE2DF for text?

Black text on #CFE2DF has a contrast ratio of 15.60:1 (passes WCAG AA); white text gives 1.35:1.