Dim Gray Color (#696969)

#696969rgb(105, 105, 105)

Dim Gray is a CSS named color defined as hex code #696969. Dim Gray is a dark neutral gray with equal red, green and blue values of 105. It is darker than CSS gray.

Color Overview & Formats

CSS: dimgrayLuminance: 0.1413
HEX
#696969
RGB
rgb(105, 105, 105)
HSL
hsl(0, 0%, 41%)
Dim Gray (#696969) Color Format Conversions
FormatSyntax / ValuesNotesAction
HEX#6969696-digit hex web code
RGBrgb(105, 105, 105)Red, Green, Blue channels (0-255)
HSLhsl(0, 0%, 41%)Hue (0°), Saturation (0%), Lightness (41%)
HSV / HSBhsv(0, 0%, 41%)Hue, Saturation (0%), Value/Brightness (41%)
CMYKcmyk(0%, 0%, 0%, 59%)Digital mathematical approximation (non-print)
OKLCHoklch(0.521 0.000 0.0)Perceptually uniform color space (CSS Color 4 approximation)
CSS Implementation & Quick Steps
background-color: #696969; /* or dimgray */
  1. Select color format: Choose the desired format (HEX #696969, RGB, or HSL).
  2. Copy the code: Click the copy button or press Tab+Enter to store in clipboard.
  3. Pair with white text: White text on Dim Gray reaches 5.49:1 (WCAG AA).

What Colors Go With Dim Gray?

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

White

#FFFFFF
5.49:1Text-safe

The natural text color on dim gray.

Ivory

#FFFFF0
5.44:1Text-safe

A softer, warmer alternative to white text.

White Smoke

#F5F5F5
5.04:1Text-safe

A soft off-white for backgrounds and text.

Gold

#FFD700
3.91:1Background / accent

A warm accent that lifts a gray palette.

Light Gray

#D3D3D3
3.67:1Background / accent

A tonal light gray for dividers and secondary text.

Sky Blue

#87CEEB
3.15:1Background / accent

A cool, airy accent for links and highlights.

Harmonious Palettes & Tints

The palettes below are algorithmically generated across standard intervals based on Dim 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.

Dim Gray
#696969
Complement (180°)
#696969
Live UI Component Mockup
Component Header SampleWhite text on Dim Gray: 5.49:1 (WCAG AA).
Button style preview

Analogous Harmony

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

Analogous (330°)
#696969
Dim Gray
#696969
Analogous (30°)
#696969
Live UI Component Mockup
Component Header SampleWhite text on Dim Gray: 5.49:1 (WCAG AA).
Button style preview

Triadic Harmony

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

Dim Gray
#696969
Triadic (120°)
#696969
Triadic (240°)
#696969
Live UI Component Mockup
Component Header SampleWhite text on Dim Gray: 5.49:1 (WCAG AA).
Button style preview

Tints & Shades

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

Tint 60%
#C3C3C3
Tint 30%
#969696
Dim Gray
#696969
Shade 30%
#4A4A4A
Shade 60%
#2A2A2A
Live UI Component Mockup
Component Header SampleWhite text on Dim Gray: 5.49:1 (WCAG AA).
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 Dim Gray (#696969)
Foreground ColorContrast RatioNormal Text (AA)Large Text (AA)Normal Text AAA (>= 7.0:1)
Pure Black (#000000)
3.83:1FailPassFail
Pure White (#FFFFFF)
5.49:1PassPassFail
Dark Charcoal (#212529)
2.81:1FailFailFail
Mid Gray (#666666)
1.05:1FailFailFail

Interactive Contrast Tester

Enter text foreground and background colors to verify WCAG legibility:

Calculated Ratio:
5.49:1
Normal: Pass AALarge: Pass AAA
Large Heading Sample (18pt Bold)

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

Dim Gray Background Download

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

Dim Gray 1920x1080 solid color background wallpaper previewStandard Wallpaper: 1920x1080 PNG (#696969)

Download Options

All wallpaper files precisely match the W3C standard color value:

Download 1920x1080 PNG

CSS Standard & Usage Notes

dimgray = #696969 (rgb(105, 105, 105))
W3C CSS Color 4

UI Design & Accessibility Guidelines

Use it for secondary text, icons, borders and calm, restrained interfaces. On Dim Gray, white text passes WCAG AA at every size (5.49:1); black text passes only for large text (3.83:1).

Published: · Modified: · Editorial: SwatchAtlas Editorial Team

Frequently Asked Questions (FAQ)

Can I use black text on Dim Gray?

Only for large text. Black text on Dim Gray has a WCAG 2.2 contrast ratio of 3.83:1: enough for large text (3:1) but below the 4.5:1 needed for body text.

Can I use white text on Dim Gray?

Yes. White text on Dim Gray has a WCAG 2.2 contrast ratio of 5.49:1, which passes AA (4.5:1) for all text sizes but not the stricter AAA level (7:1) for body text.

What colors go with Dim Gray?

White, Ivory, White Smoke, Gold, Light Gray and Sky Blue all go well with Dim Gray. White (5.49:1), Ivory (5.44:1) and White Smoke (5.04:1) have enough contrast for text on Dim Gray; Gold, Light Gray and Sky Blue work better as a background or accent.

Is dim gray darker than gray?

Yes. Dim Gray (#696969) has a lightness of 41%, while CSS Gray (#808080) has 50%.