Gainsboro Complementary Color Scheme

Five colors arranged by the complementary rule around Gainsboro (#DCDCDC), each snapped to its nearest named color.

#DCDCDC

#F4EFEE

#D4E4E5

#A4C8C8

#F0F4F2

Color names and codes

Name	HEX	RGB	HSL	CMYK	OKLCH
Gainsboro	`#DCDCDC`	220, 220, 220	0°, 0%, 86%	0, 0, 0, 14	89.4% 0.000 0
Angelic Wings	`#F4EFEE`	244, 239, 238	10°, 21%, 95%	0, 2, 2, 4	95.6% 0.006 31
Waterfront	`#D4E4E5`	212, 228, 229	184°, 25%, 86%	7, 0, 0, 10	90.7% 0.017 201
Ocean Boulevard	`#A4C8C8`	164, 200, 200	180°, 25%, 71%	18, 0, 0, 22	80.7% 0.038 196
Bakery Box	`#F0F4F2`	240, 244, 242	150°, 15%, 95%	2, 0, 1, 4	96.4% 0.005 165

Which pairs work for text

Text on background	Contrast	WCAG
Aa #A4C8C8 on #F0F4F2	1.62:1	—
Aa #F4EFEE on #A4C8C8	1.58:1	—
Aa #D4E4E5 on #A4C8C8	1.37:1	—
Aa #DCDCDC on #A4C8C8	1.31:1	—
Aa #DCDCDC on #F0F4F2	1.24:1	—
Aa #DCDCDC on #F4EFEE	1.20:1	—

CSS variables

:root {
  --color-1: #dcdcdc; /* Gainsboro */
  --color-2: #f4efee; /* Angelic Wings */
  --color-3: #d4e4e5; /* Waterfront */
  --color-4: #a4c8c8; /* Ocean Boulevard */
  --color-5: #f0f4f2; /* Bakery Box */
}

Other schemes from Gainsboro

More very light gray complementary color schemes

Questions

What colors go with Gainsboro?

In a complementary scheme: Angelic Wings (#F4EFEE), Waterfront (#D4E4E5), Ocean Boulevard (#A4C8C8), Bakery Box (#F0F4F2).

What is the hex code of Gainsboro?

#DCDCDC.