Dark Gray Color (#A9A9A9)

#A9A9A9rgb(169, 169, 169)

Dark Gray is a CSS named color defined as hex code #A9A9A9. CSS dark gray is a neutral mid-light gray, and it is lighter than CSS gray. The names come from an older color list and are not in order of brightness.

Color Overview & Formats

CSS: darkgrayLuminance: 0.3968
HEX
#A9A9A9
RGB
rgb(169, 169, 169)
HSL
hsl(0, 0%, 66%)
Dark Gray (#A9A9A9) Color Format Conversions
FormatSyntax / ValuesNotesAction
HEX#A9A9A96-digit hex web code
RGBrgb(169, 169, 169)Red, Green, Blue channels (0-255)
HSLhsl(0, 0%, 66%)Hue (0°), Saturation (0%), Lightness (66%)
HSV / HSBhsv(0, 0%, 66%)Hue, Saturation (0%), Value/Brightness (66%)
CMYKcmyk(0%, 0%, 0%, 34%)Digital mathematical approximation (non-print)
OKLCHoklch(0.735 0.000 0.0)Perceptually uniform color space (CSS Color 4 approximation)
CSS Implementation & Quick Steps
background-color: #A9A9A9; /* or darkgray */
  1. Select color format: Choose the desired format (HEX #A9A9A9, RGB, or HSL).
  2. Copy the code: Click the copy button or press Tab+Enter to store in clipboard.
  3. Pair with black text: Black text on Dark Gray reaches 8.94:1 (WCAG AAA).

What Colors Go With Dark Gray?

These 6 colors all go well with Dark Gray (#A9A9A9), and each one is a standard CSS named color. The ratio is the WCAG 2.2 contrast of that color on Dark Gray: at 4.5:1 or above it works for text; below that, use it for backgrounds and accents.

Black

#000000
8.94:1Text-safe

Strong, readable text on dark gray.

Navy

#000080
6.81:1Text-safe

A deep blue that gives readable text and a crisp contrast.

6.32:1Text-safe

A softer dark blue for headings and text.

3.8:1Background / accent

A dark neutral with a slight teal tint.

White

#FFFFFF
2.35:1Background / accent

Clean space around dark gray blocks; not for text on it.

Ivory

#FFFFF0
2.33:1Background / accent

A warm off-white for backgrounds and spacing.

Harmonious Palettes & Tints

The palettes below are algorithmically generated across standard intervals based on Dark Gray (HSL 0°). Each group offers full palette copy and live preview:

Complementary Harmony

Hue rotated 180 degrees on the HSL wheel (0° to 180°), keeping the original saturation and lightness.

Dark Gray
#A9A9A9
Complement (180°)
#A9A9A9
Live UI Component Mockup
Component Header SampleBlack text on Dark Gray: 8.94:1 (WCAG AAA).
Button style preview

Analogous Harmony

Hues 30 degrees either side (330° and 30°), keeping the original saturation and lightness.

Analogous (330°)
#A9A9A9
Dark Gray
#A9A9A9
Analogous (30°)
#A9A9A9
Live UI Component Mockup
Component Header SampleBlack text on Dark Gray: 8.94:1 (WCAG AAA).
Button style preview

Triadic Harmony

Hues spaced evenly by 120 degrees (120° and 240°), keeping the original saturation and lightness.

Dark Gray
#A9A9A9
Triadic (120°)
#A9A9A9
Triadic (240°)
#A9A9A9
Live UI Component Mockup
Component Header SampleBlack text on Dark Gray: 8.94:1 (WCAG AAA).
Button style preview

Tints & Shades

Mixed with white (tints) and black (shades) in sRGB at 60% and 30%.

Tint 60%
#DDDDDD
Tint 30%
#C3C3C3
Dark Gray
#A9A9A9
Shade 30%
#767676
Shade 60%
#444444
Live UI Component Mockup
Component Header SampleBlack text on Dark Gray: 8.94:1 (WCAG AAA).
Button style preview

WCAG 2.2 Text Readability & Contrast Check

Under WCAG 2.2 criteria, regular body text requires at least 4.5:1 (AA) and large text requires at least 3.0:1. The table below displays calculated contrast ratios:

Text Contrast Ratios on Dark Gray (#A9A9A9)
Foreground ColorContrast RatioNormal Text (AA)Large Text (AA)Normal Text AAA (>= 7.0:1)
Pure Black (#000000)
8.94:1PassPassPass
Pure White (#FFFFFF)
2.35:1FailFailFail
Dark Charcoal (#212529)
6.56:1PassPassFail
Mid Gray (#666666)
2.44:1FailFailFail

Interactive Contrast Tester

Enter text foreground and background colors to verify WCAG legibility:

Calculated Ratio:
8.94:1
Normal: Pass AAALarge: Pass AAA
Large Heading Sample (18pt Bold)

This is sample body text rendered directly to verify contrast and readability.

Dark Gray Background Download

Download standard 1920x1080 solid desktop wallpaper or generate mobile wallpaper:

Dark Gray 1920x1080 solid color background wallpaper previewStandard Wallpaper: 1920x1080 PNG (#A9A9A9)

Download Options

All wallpaper files precisely match the W3C standard color value:

Download 1920x1080 PNG

CSS Standard & Usage Notes

darkgray = #a9a9a9 (rgb(169, 169, 169))
W3C CSS Color 4

UI Design & Accessibility Guidelines

Use it for borders, placeholder text, disabled states and neutral backgrounds. On Dark Gray, black text passes WCAG AAA at every size (8.94:1); white text fails even for large text (2.35:1).

Published: · Modified: · Editorial: SwatchAtlas Editorial Team

Frequently Asked Questions (FAQ)

Can I use black text on Dark Gray?

Yes. Black text on Dark Gray has a WCAG 2.2 contrast ratio of 8.94:1, passing both AA (4.5:1) and AAA (7:1) at every text size.

Can I use white text on Dark Gray?

No. White text on Dark Gray has a WCAG 2.2 contrast ratio of only 2.35:1, below the 3:1 minimum even for large text.

What colors go with Dark Gray?

Black, Navy, Midnight Blue, Dark Slate Gray, White and Ivory all go well with Dark Gray. Black (8.94:1), Navy (6.81:1) and Midnight Blue (6.32:1) have enough contrast for text on Dark Gray; Dark Slate Gray, White and Ivory work better as a background or accent.

Why is dark gray lighter than gray in CSS?

CSS Dark Gray (#A9A9A9) is lighter than Gray (#808080). It is a historical quirk of the color names CSS inherited. Dim Gray (#696969) is darker than both.