Maroon Colors  ·  Color Library

Palettes / Colors / #CCDCD6

#CCDCD6 — Pale Dusty Green

#CCDCD6 is a green color we call Pale Dusty Green, closest to the named color Gainsboro (#DCDCDC). It belongs to the green family.

Color name

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

#CCDCD6 is a cool green color associated with growth, calm 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 #DCCBD2; it also sits naturally between #CBDCCD and #CBDADC. In the palettes below you can see it working alongside real color combinations from our collection.

#CCDCD6 · RGB 204, 220, 214

Download PNG swatch SVG

Color values

HEX#CCDCD6
RGB204, 220, 214
HSL157°, 19%, 83%
HSV157°, 7%, 86%
CMYK7%, 0%, 3%, 14%
XYZ62.63, 68.88, 73.61
Yxy68.88, 0.3053, 0.3358
CIE-Lab86.44, -6.47, 1.09
Hunter Lab82.99, -6.19, 1.03

RGB & CMYK percentages

Red 80% · Green 86% · Blue 84%

Cyan 7% · Magenta 0% · Yellow 3% · Key 14%

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

Previews

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

CSS code for #CCDCD6

.text { color: #CCDCD6; }
.background { background-color: #CCDCD6; }
.border { border: 3px solid #CCDCD6; }
.text-rgb { color: rgb(204, 220, 214); }
.text-hsl { color: hsl(157, 19%, 83%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #CCDCD6; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(204, 220, 214, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #CCDCD6; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(204, 220, 214, 0.8); }

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

Shades of #CCDCD6

#B3CBC2#9BBBAF#83AA9B#6A9A88#5B8675#4A6D60#3A554B#293D35#192420#080C0B

Tints of #CCDCD6

#CEDED8#D5E2DD#D8E4DF#DBE6E2#E1EAE7#E4ECE9#E7EEEC#EAF1EE#F0F5F3#F3F7F5

Tones of #CCDCD6

#CDDBD5#CEDAD5#CFD8D5#D0D7D4#D1D6D4#D2D5D4

Color harmonies

Complementary — #DCCBD2:

Analogous:

Triadic:

Contrast & accessibility

Against white text1.42:1 Fails
Against black text14.78:1 AAA

Best text color on #CCDCD6: #000000.

Semi-transparent (opacity) text on #CCDCD6

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

How #CCDCD6 looks with color blindness

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

Protanopia · #D3D3D7Deuteranopia · #D2D1D8Tritanopia · #CDD9D9

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

Palette 3368a0
#3368A0 · #66A3BF · #C8DFDB · #F2EFE7
Palette 727d73
#727D73 · #AAB99A · #D0DDD0 · #F0F0D7
Palette 37353e
#37353E · #44444E · #715A5A · #D3DAD9
Palette F6d7a7
#F6D7A7 · #F6EABE · #C8E3D4 · #87AAAA
Palette E8c872
#E8C872 · #FFF3CF · #C9D7DD · #637A9F
Palette 16423c
#16423C · #6A9C89 · #C4DAD2 · #E9EFEC

Similar colors

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

#C8DFDB#D0DDD0#D3DAD9#C8E3D4#C9D7DD#C4DAD2#D3DEDC#D3E0DC#D4E2D4#D1D3D4#CEE5D0#CBE4DE

Browse neighbouring colors

← #CCDCD5  ·  #CCDCD7 →

Frequently asked questions

What color is #CCDCD6?

#CCDCD6 is Pale Dusty Green, a green color (RGB 204, 220, 214). Its closest standard named color is Gainsboro.

What is the RGB and HSL of #CCDCD6?

#CCDCD6 is RGB 204, 220, 214 — HSL 157°, 19%, 83% — CMYK 7%, 0%, 3%, 14%.

What colors go with #CCDCD6?

Its complement is #DCCBD2; analogous partners are #CBDCCD and #CBDADC. It also appears in 6+ palettes in our collection.

Can I use #CCDCD6 for text?

Black text on #CCDCD6 has a contrast ratio of 14.78:1 (passes WCAG AA); white text gives 1.42:1.