Gainsboro is a light, neutral shade in the gray color family, with a neutral feel. Its HEX code is #DCDCDC, which equals rgb(220, 220, 220) in RGB and hsl(0, 0%, 86%) in HSL. In print terms it converts to roughly C0 M0 Y0 K14, although exact CMYK results depend on the paper and color profile.
- HEX
#DCDCDC - RGB
220, 220, 220 - HSL
0°, 0%, 86% - CMYK
0, 0, 0, 14 - Family
Gray - Tone
Light, neutral
About Gainsboro
Gray shades are neutral and versatile. They provide calm backgrounds, readable text colors and borders, and let brighter accent colors stand out. Designers often reach for it as an accent, a button color or a background tint. Text in black is the most readable choice on this color, with a contrast ratio of 15.31:1. Its complementary color is #DBDBDB.
Download Gainsboro as an image
Choose a size and format, then download a solid-color image — or tick colors in the library to batch-download a ZIP.
Loading colors…
Loading gradients…
Gainsboro color codes
| HEX | #DCDCDC |
|---|---|
| RGB | rgb(220, 220, 220) |
| HSL | hsl(0, 0%, 86%) |
| HSV | 0°, 0%, 86% |
| CMYK | 0%, 0%, 0%, 14% |
| Decimal | 14474460 |
Shades and tints of Gainsboro
Lighter tints are mixed with white and darker shades are mixed with black.
- 50
#F9F9F9 - 100
#F3F3F3 - 200
#EEEEEE - 300
#E8E8E8 - 400
#E2E2E2 - 500
#DCDCDC - 600
#B7B7B7 - 700
#939393 - 800
#6E6E6E - 900
#494949 - 950
#252525
Color harmonies for Gainsboro
- Complementary
#DBDBDB≈ Gainsboro - Analogous −30°
#DBDBDB≈ Gainsboro - Analogous +30°
#DBDBDB≈ Gainsboro - Triadic +120°
#DBDBDB≈ Gainsboro - Triadic +240°
#DBDBDB≈ Gainsboro - Split 150°
#DBDBDB≈ Gainsboro - Split 210°
#DBDBDB≈ Gainsboro
Contrast and accessibility of Gainsboro
| Text color | Sample | Contrast ratio | WCAG |
|---|---|---|---|
| White text on Gainsboro | Aa | 1.37:1 | Fails |
| Black text on Gainsboro | Aa | 15.31:1 | AAA (excellent) |
CSS code for Gainsboro
background-color: #DCDCDC;color: #DCDCDC;background-color: rgb(220, 220, 220);background-color: hsl(0, 0%, 86%);:root { --color-gainsboro: #DCDCDC; }class="bg-[#DCDCDC]"Colors similar to Gainsboro
- Neutral Gray 85
#D9D9D9 - Warm Gray 85
#DCD9D5 - Cool Gray 85
#D5D8DC - Palest Dusty Blue
#E0E0EB - Palest Dusty Ultramarine
#E1E0EB - Palest Dusty Royal
#E0E1EB - Palest Dusty Indigo
#E2E0EB - Palest Dusty Cobalt
#E0E2EB - Palest Dusty Iris
#E3E0EB - Palest Dusty Sapphire
#E0E3EB - Palest Dusty Periwinkle
#E4E0EB - Light Gray
#D3D3D3
More gray shades
- Silver
#C0C0C0 - Dark Gray
#A9A9A9 - Slate Gray
#708090 - Dim Gray
#696969 - Gray
#808080 - Light Gray
#D3D3D3 - Pewter
#8B8E92 - Ash Gray
#B2BEB5 - Graphite
#383838 - Onyx
#353839 - Ebony
#555D50
Frequently asked questions
What is the HEX code for Gainsboro?
The HEX code for Gainsboro is #DCDCDC.
What is the RGB value of Gainsboro?
Gainsboro has an RGB value of 220, 220, 220 (rgb(220, 220, 220)). In HSL it is 0°, 0%, 86%.
What text color should I use on Gainsboro?
Use black text on Gainsboro. White text has a contrast ratio of 1.37:1 and black text has 15.31:1; WCAG AA requires at least 4.5:1 for normal text.
What color goes well with Gainsboro?
The complementary color of Gainsboro is #DBDBDB. Analogous colors #DBDBDB and #DBDBDB also pair well.