Skip to content
PantoneTools
neutral
Open Color

Gray 7

gray-7 · #495057

HEX

#495057

RGB

rgb(73, 80, 87)

CMYK

cmyk(16%, 8%, 0%, 66%)

HSL

hsl(210, 9%, 31%)

LAB

lab(33.6, -1.1, -5.1)

What is Gray 7?

Gray 7 is the gray-7 reference in the Open Color. Its sRGB value is #495057 (rgb 73, 80, 87). It sits in the neutral family. Open Color, an open-source color palette by Heeyeun designed for UI work. 13 hues across 10 shades (0 to 9) tuned for screen legibility and accessibility. See disclaimer for accuracy and trademark notes.

Accessibility

WCAG 2.1 contrast checks for Gray 7 as a background.

Black text on this color

Sample text · 2.57 : 1
AA Normal
AA Large
AAA Normal
AAA Large

White text on this color

Sample text · 8.18 : 1
AA Normal
AA Large
AAA Normal
AAA Large

Shades, tints & tonal scale of Gray 7

An 11-step tonal scale derived from Gray 7 (#495057). Click any swatch to copy its HEX. Use these as a starting point for design tokens, hover states, and disabled states in a design system.

Copied #F0F1F2

50

#F0F1F2

#F0F1F2

Copied #E2E3E4

100

#E2E3E4

#E2E3E4

Copied #C5C7C9

200

#C5C7C9

#C5C7C9

Copied #A4A8AB

300

#A4A8AB

#A4A8AB

Copied #777C81

400

#777C81

#777C81

Copied #495057

500

#495057

#495057

Copied #3E444A

600

#3E444A

#3E444A

Copied #2F3439

700

#2F3439

#2F3439

Copied #212427

800

#212427

#212427

Copied #121416

900

#121416

#121416

Copied #090A0A

950

#090A0A

#090A0A

Lighter tints (mixed with white)

Copied #7D8184

15%

#7D8184

Copied #9FA1A3

30%

#9FA1A3

Copied #B9BBBC

45%

#B9BBBC

Copied #CFD0D1

60%

#CFD0D1

Copied #E3E3E4

75%

#E3E3E4

Darker shades (mixed with black)

Copied #434A50

15%

#434A50

Copied #3D4349

30%

#3D4349

Copied #363B41

45%

#363B41

Copied #2D3237

60%

#2D3237

Copied #23272B

75%

#23272B

Color harmonies for Gray 7

Classic color-theory harmonies derived from rotating the hue of Gray 7. Use these to build accent palettes, brand systems, and accessible UI color pairings.

Complementary

180° opposite — strongest contrast

Copied #495057

#495057

#495057

Copied #564F48

#564F48

#564F48

Triadic

Three colors 120° apart

Copied #495057

#495057

#495057

Copied #56484F

#56484F

#56484F

Copied #4F5648

#4F5648

#4F5648

Analogous

Two neighbors ±30° on the wheel

Copied #485656

#485656

#485656

Copied #495057

#495057

#495057

Copied #484856

#484856

#484856

Split-complementary

Base + two colors flanking its complement

Copied #495057

#495057

#495057

Copied #564848

#564848

#564848

Copied #565648

#565648

#565648

Tetradic

Two complementary pairs

Copied #495057

#495057

#495057

Copied #4F4856

#4F4856

#4F4856

Copied #564F48

#564F48

#564F48

Copied #4F5648

#4F5648

#4F5648

Square

Four colors evenly spaced 90° apart

Copied #495057

#495057

#495057

Copied #564856

#564856

#564856

Copied #564F48

#564F48

#564F48

Copied #485648

#485648

#485648

Gray 7 in every color space

Full conversion of Gray 7 across the color spaces designers and developers actually use — including OKLCH (the perceptually-uniform space that powers Tailwind v4 and CSS Color Module Level 4) and HWB.

HEX

#495057

RGB

rgb(73, 80, 87)

CMYK

cmyk(16%, 8%, 0%, 66%)

HSL

hsl(210, 9%, 31%)

HSV

hsv(210, 16%, 34%)

HWB

hwb(210 29% 66%)

CIE Lab

lab(33.6 -1.1 -5.1)

OKLCH

oklch(42.8% 0.015 248.2)

XYZ (D65)

xyz(7.34, 7.84, 10.14)

Copy-ready code for Gray 7

Drop-in snippets for CSS, Tailwind, Sass, iOS Swift, and Android XML. Click the copy button on any snippet to put it on your clipboard.

CSS

color: #495057;
background-color: #495057;

CSS variable

:root {
  --color-gray-7: #495057;
}

Tailwind config

// tailwind.config.js
colors: {
  'gray-7': '#495057',
}

Sass

$color-gray-7: #495057;

Swift UIColor

UIColor(red: 0.286, green: 0.314, blue: 0.341, alpha: 1.0)

Android XML

<color name="gray-7">#495057</color>

Closest match in every color system

The nearest Gray 7 equivalent in every other color system on this site, ranked by ΔE2000 perceptual distance. Useful when translating between design-system, web-standard, and industrial color references.

Closest in Open Color

Top 6 ΔE2000-closest entries within the same collection.

Top 6 ΔE2000-closest Pantone references. Cross-system matching is approximate — see disclaimer.

Top 6 ΔE2000-closest RAL Classic references for industrial coating cross-reference.

Copied #474A51

RAL 7024

#474A51

Graphite grey

Copied #474B4E

RAL 7031

#474B4E

Blue grey

Copied #434750

RAL 7015

#434750

Slate grey

Copied #434B4D

RAL 7011

#434B4D

Iron grey

Copied #4E5452

RAL 7012

#4E5452

Basalt grey

Copied #4E5754

RAL 7009

#4E5754

Green grey

FAQ about Gray 7

What is the HEX code for Gray 7?

Gray 7 (gray-7) has the HEX code #495057. In RGB it is rgb(73, 80, 87), and in CMYK it is cmyk(16%, 8%, 0%, 66%).

What is the OKLCH value of Gray 7?

Gray 7 converts to oklch(0.428 0.015 248.2). OKLCH is the perceptually uniform color space used by Tailwind v4 and CSS Color Module Level 4.

Is Gray 7 accessible for body text?

Used as a background, Gray 7 has a contrast ratio of 2.57:1 with black text and 8.18:1 with white text. WCAG 2.1 AA requires 4.5:1 for normal text. The current recommendation is to use white text and verify in real UI context.

What is the closest Pantone to Gray 7?

The closest Pantone reference to Gray 7 by ΔE2000 perceptual distance is Pantone Cool Gray 11 C (#53565A). Cross-system Pantone matching is approximate; for color-critical print work, verify with a physical Pantone guide.

What is the closest RAL color to Gray 7?

The closest RAL Classic reference to Gray 7 by ΔE2000 distance is RAL 7024 (Graphite grey, #474A51). RAL is a German industrial coating standard commonly used for paint, powder coat, and architectural specification.

What is the complementary color of Gray 7?

The complementary color (180° opposite on the HSL color wheel) of Gray 7 is #564F48. Use it for high-contrast accents, error states, or call-to-action pairings.

Data provenance & source

Open Color (Yeun)

Open Color, an open-source color palette by Heeyeun designed for UI designers and developers. 13 hues across 10 shades. Use as a designer-friendly palette alternative to Tailwind. Values are intentionally chosen for UI legibility and accessibility.

Source type
derived
Confidence
high
License
MIT
Last reviewed
2026-05-24

Workflow tags

open-color
design-token
ui
neutral

Open Color values are tuned for digital UI. For print, treat as a starting point and proof against the substrate.

Open Color · Gray 7 — #495057 | PantoneTools