LightGray Color — HEX, RGB, HSL, Palettes & Contrast

LightGray (#d3d3d3): Complete color reference with HEX, RGB, HSL values, tints & shades, complementary, analogous, triadic, split-complementary, and tetradic palettes, WCAG contrast recommendations, and ready-to-use CSS code.

#d3d3d3
HEX #d3d3d3
RGB rgb(211, 211, 211)
HSL 0°, 0%, 83%

Use LightGray in Your Projects

About LightGray Color

LightGray is a soft, neutral gray that is ubiquitous in web design for borders, dividers, and subtle UI elements. It provides structure without visual weight.

Use Cases for LightGray

bordersdividerssubtle backgroundsdisabled statecard outlines

Shades & Tints of LightGray

#ffffff
#f4f4f4
#e9e9e9
#dedede
#d3d3d3
#9e9e9e
#6a6a6a
#353535
#000000

Complementary Color

#d3d3d3
#d4d4d4

Analogous Colors

#d4d4d4
#d3d3d3
#d4d4d4

Triadic Colors

#d3d3d3
#d4d4d4
#d4d4d4

Split Complementary

#d3d3d3
#d4d4d4
#d4d4d4

Tetradic Colors

#d3d3d3
#d4d4d4
#d4d4d4
#d4d4d4

CSS Code

.lightgray-color {
  color: #d3d3d3;
  background-color: #d3d3d3;
}

/* As a CSS custom property */
:root {
  --color-lightgray: #d3d3d3;
}

Accessibility Score

75 / 100
Rating: Good
AA contrast on best text color (30 pts)
AAA contrast on best text color (25 pts)
Versatile lightness for backgrounds & text (25 pts)
Not extreme black/white (20 pts)

A combined score based on WCAG contrast compliance, lightness versatility, and usable range. Higher scores mean the color works well in more design contexts.

Contrast Recommendations

Black text on LightGray
Ratio: 14.03:1 ✓ Passes AA ✓ Passes AAA
White text on LightGray
Ratio: 1.5:1 ✗ Fails AA ✗ Fails AAA

Frequently Asked Questions

What color is LightGray?

LightGray is represented by the hex code #d3d3d3 and has RGB values of rgb(211, 211, 211). It falls under the Gray category.

How to use LightGray in web design?

LightGray works well for borders, dividers, subtle backgrounds. LightGray is a soft, neutral gray that is ubiquitous in web design for borders, dividers, and subtle UI elements. It provides structure without visual weight. Use it as a primary color, accent, or background depending on your design needs.

What colors go with LightGray?

Colors that pair well with LightGray include gainsboro, silver, whitesmoke, darkgray, gray. For a complementary scheme, try #d4d4d4. For an analogous scheme, use #d4d4d4 and #d4d4d4. For a triadic scheme, combine with #d4d4d4 and #d4d4d4.