Using Dark Gray in design
HEX
#A9A9A9
RGB
169, 169, 169
HSL
0°, 0%, 66%
HSV
0°, 0%, 66%
Enough weight to anchor a layout, yet short of the void-like finality of near-black. #A9A9A9 makes contrast readable without the harsh snap of pure black on white. A pragmatic middle ground for borders, secondary type, and quiet emphasis.
Best for
Product launches, promotional banners, and e-commerce storefronts.
Accessibility
Check contrast before using dark gray for text-heavy layouts, especially on low-contrast backgrounds.
How does dark gray compare to nearby colors?
What is the difference between dark gray and silver?
The visible difference between Dark Gray (#A9A9A9) and Silver (#C0C0C0) is subtle, but it still nudges the family from brushed gray toward paper, plaster, and interface chrome. Dark Gray gives the palette a more grounded center of gravity, which matters if headlines, UI chrome, or darker sections need to feel settled. Start with dark gray when the palette wants more brushed gray; switch to silver when the better fit is paper, plaster, and interface chrome.
What color is dark gray?
Despite the word "dark," CSS darkgray (#A9A9A9) is actually a medium gray — a known source of naming confusion for developers.
What is the hex code for dark gray?
| Format | Value |
|---|---|
| HEX | #A9A9A9 |
| RGB | rgb(169, 169, 169) |
| HSL | hsl(0°, 0%, 66%) |
| HSV / HSB | hsv(0°, 0%, 66%) |
| CMYK (approx.) | cmyk(0%, 0%, 0%, 34%) |
Convert Dark Gray to other color formats
Open the color converter with Dark Gray (#A9A9A9) prefilled to copy RGB, HSL, HSV, CMYK, or OKLCH values.
Convert Dark Gray in the color converter →What does dark gray mean in design?
Dark gray is often associated with moderation, restraint, and functional hierarchy. It tends to read as more grounded than pale grays but less severe than graphite or onyx.
How do I use dark gray in code?
| CSS (hex) | color: #A9A9A9; |
| CSS (rgb) | color: rgb(169, 169, 169); |
| CSS (hsl) | color: hsl(0, 0%, 66%); |
| RGB % | rgb(66%, 66%, 66%) |
| Tailwind | text-[#A9A9A9] |
| SwiftUI | Color(red: 0.663, green: 0.663, blue: 0.663) |
| UIKit | UIColor(red: 0.663, green: 0.663, blue: 0.663, alpha: 1.0) |
| Android | Color.rgb(169, 169, 169) |
| Compose | Color(0xFFA9A9A9) |
| Web Safe | #999999 |
Is dark gray accessible?
| Combination | Ratio | AA | AA lg | AAA | AAA lg | UI |
|---|---|---|---|---|---|---|
| AaWhite text on this color | 2.35:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaBlack text on this color | 8.94:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaThis color as text on white | 2.35:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaThis color as text on black | 8.94:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
WCAG 2.1: AA normal ≥ 4.5:1, AA large text ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1, UI components ≥ 3:1.
How does dark gray look with color blindness?
Simulated appearance for common types of color vision deficiency. Actual perception varies by individual.
What colors go with dark gray
Charcoal balances dark gray by turning the palette into a usable light-dark system rather than a field of soft midtones.
Pairing dark gray with white keeps the layout open and lets the color's smoky gray cast stay easy to read.
Navy blue makes dark gray easier to organize in real layouts by separating the bright surface role from the dark-value role.
What colors clash with dark gray
Magenta injects more cosmetic or nightlife energy than dark gray can comfortably absorb, so restrained neutral palettes start to feel accidental.
Light Gray sits too close to dark gray in value, so the palette can wash out before it ever establishes a clear hierarchy.
How should I use dark gray in design?
- •Use dark gray for buttons, badges, and chart accents where it can stand out. Test text contrast with WCAG tools before using it for body copy on light backgrounds.
- •Dark Gray is versatile enough to support any palette direction. Pair it with one saturated accent for emphasis and one lighter neutral for breathing room.
- •Dark Gray is a supporting player — effective for borders, dividers, secondary text, and UI scaffolding that needs to stay out of the way.
What are good dark gray palettes?
Light touch
Product launches, promotional banners, and e-commerce storefronts.
Design with dark gray in Moda
Create a presentation or document using dark gray as your accent color. Moda's AI applies your color palette automatically.
Create a design with dark gray →What are the shades and tints of dark gray?
Shades (darker)
Tints (lighter)
Tones (desaturated)
Similar colors
Silver
Silver and dark gray do nearly the same structural job, so the decision comes down to whether the neutral should feel more smoky gray or more smoky gray.
Pewter
Pewter stays neutral like dark gray, yet the lighter-or-darker move changes how much hierarchy the palette gets before any accent color enters.
Gray
Gray stays neutral like dark gray, yet the lighter-or-darker move changes how much hierarchy the palette gets before any accent color enters.
Light Gray
Light Gray stays neutral like dark gray, yet the lighter-or-darker move changes how much hierarchy the palette gets before any accent color enters.
Rose Gold
Rose Gold does what dark gray cannot: it nudges the palette toward a warm mood while still behaving like a supporting color.
Frequently asked questions
What is the hex code for dark gray?
The hex code for dark gray is #A9A9A9. In RGB, that's 169 red, 169 green, and 169 blue. The approximate CMYK equivalent is 0% cyan, 0% magenta, 0% yellow, and 34% key (black).
Is dark gray a warm or cool color?
Dark Gray behaves like a neutral with very little chromatic push, so surrounding colors do more to set the palette temperature than the swatch itself.
Is dark gray suitable for broader surfaces and long-form layouts?
Dark Gray can hold broader surfaces comfortably because it does not demand attention on every glance. It is a better candidate for full-theme use than a brighter or more electric neighbor would be.
How should I use dark gray in a design?
Dark Gray has enough restraint to hold large surfaces comfortably, which makes it useful for full theme systems, document backgrounds, or broad section color without constant visual fatigue.
Can I use dark gray for text or backgrounds?
Dark Gray works better with dark text than white text. Black text reaches 8.94:1 contrast on the swatch, which makes the color more usable as a background or highlight surface than as a dark panel.
More neutral colors
Keep exploring color resources
All color pages
Browse the full library of color references, pairings, and palettes.
Neutral colors
Compare dark gray with other neutral tones.
Blue colors
Explore nearby color families to build stronger palettes and contrasts.
Brown colors
Explore nearby color families to build stronger palettes and contrasts.
Green colors
Explore nearby color families to build stronger palettes and contrasts.
Last updated April 6, 2026
Color values are computed from the listed hex code using standard conversion formulas. RGB, HSL, and HSV are exact screen-ready conversions. CMYK is an approximate on-screen reference, not a press-ready print specification. Pairings, palettes, and use-case guidance are heuristic recommendations derived from color relationships, contrast behavior, and common presentation, document, and UI patterns.