gainsboro — #DCDCDC
#DCDCDC
rgb(220, 220, 220) · hsl(0, 0%, 86%) · CSS keyword gainsboro
Can you put text on it?
| Contrast | Body text | Large text | |
|---|---|---|---|
| gainsboro on white | 1.37:1 | — | — |
| gainsboro on black | 15.31:1 | AA | AA |
As a background, gainsboro takes black text: 15.31:1 against 1.37:1 the other way. A colour picker will give you the hex and stop there, which is why so many palettes look right and fail an accessibility audit.
Where the name comes from
Named after Thomas Gainsborough, the painter, for reasons nobody has satisfactorily explained.
Using it
color: gainsboro;
color: #dcdcdc;
color: rgb(220 220 220);
All three are the same colour. The keyword is one of the 141 CSS named colours — a list settled in CSS 2.1 and added to exactly once since, when rebeccapurple was standardised in 2014.
Colours close to gainsboro
- lightgray — #D3D3D3
- lavender — #E6E6FA
- wheat — #F5DEB3
- antiquewhite — #FAEBD7
- mistyrose — #FFE4E1
- palegoldenrod — #EEE8AA
Frequently asked questions
What is the hex code for gainsboro?
The hex code for gainsboro is #DCDCDC — RGB 220, 220, 220.
Can I use gainsboro for text?
Not on a white background. gainsboro reaches only 1.37:1, and WCAG AA asks for 4.5:1. It works as a background or a border, not as ink.
Should text on gainsboro be black or white?
Black — 15.31:1 against 1.37:1 the other way.
Other named colours
- ghostwhite — #F8F8FF
- gold — #FFD700
- goldenrod — #DAA520
- gray — #808080
- green — #008000
- greenyellow — #ADFF2F
- honeydew — #F0FFF0
- hotpink — #FF69B4
- indianred — #CD5C5C
- indigo — #4B0082
- ivory — #FFFFF0
- khaki — #F0E68C
#DCDCDC in full — tints, shades and harmonies · All named colours · Colour reference