Skip to content
PantoneTools
blue
Open Color

Gray 1

gray-1 · #F1F3F5

HEX

#F1F3F5

RGB

rgb(241, 243, 245)

CMYK

cmyk(2%, 1%, 0%, 4%)

HSL

hsl(210, 17%, 95%)

LAB

lab(95.7, -0.3, -1.2)

What is Gray 1?

Gray 1 is the gray-1 reference in the Open Color. Its sRGB value is #F1F3F5 (rgb 241, 243, 245). It sits in the blue 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 1 as a background.

Black text on this color

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

White text on this color

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

Shades, tints & tonal scale of Gray 1

An 11-step tonal scale derived from Gray 1 (#F1F3F5). 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 #FEFEFE

50

#FEFEFE

#FEFEFE

Copied #FDFDFD

100

#FDFDFD

#FDFDFD

Copied #FBFBFC

200

#FBFBFC

#FBFBFC

Copied #F8F9FA

300

#F8F9FA

#F8F9FA

Copied #F5F6F8

400

#F5F6F8

#F5F6F8

Copied #F1F3F5

500

#F1F3F5

#F1F3F5

Copied #CDCFD0

600

#CDCFD0

#CDCFD0

Copied #9D9E9F

700

#9D9E9F

#9D9E9F

Copied #6C6D6E

800

#6C6D6E

#6C6D6E

Copied #3C3D3D

900

#3C3D3D

#3C3D3D

Copied #1D1D1D

950

#1D1D1D

#1D1D1D

Lighter tints (mixed with white)

Copied #F3F5F7

15%

#F3F5F7

Copied #F5F7F8

30%

#F5F7F8

Copied #F7F8FA

45%

#F7F8FA

Copied #FAFAFB

60%

#FAFAFB

Copied #FCFCFD

75%

#FCFCFD

Darker shades (mixed with black)

Copied #E0E2E4

15%

#E0E2E4

Copied #CED0D1

30%

#CED0D1

Copied #B9BABC

45%

#B9BABC

Copied #A0A1A3

60%

#A0A1A3

Copied #818283

75%

#818283

Color harmonies for Gray 1

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

Complementary

180° opposite — strongest contrast

Copied #F1F3F5

#F1F3F5

#F1F3F5

Copied #F4F2F0

#F4F2F0

#F4F2F0

Triadic

Three colors 120° apart

Copied #F1F3F5

#F1F3F5

#F1F3F5

Copied #F4F0F2

#F4F0F2

#F4F0F2

Copied #F2F4F0

#F2F4F0

#F2F4F0

Analogous

Two neighbors ±30° on the wheel

Copied #F0F4F4

#F0F4F4

#F0F4F4

Copied #F1F3F5

#F1F3F5

#F1F3F5

Copied #F0F0F4

#F0F0F4

#F0F0F4

Split-complementary

Base + two colors flanking its complement

Copied #F1F3F5

#F1F3F5

#F1F3F5

Copied #F4F0F0

#F4F0F0

#F4F0F0

Copied #F4F4F0

#F4F4F0

#F4F4F0

Tetradic

Two complementary pairs

Copied #F1F3F5

#F1F3F5

#F1F3F5

Copied #F2F0F4

#F2F0F4

#F2F0F4

Copied #F4F2F0

#F4F2F0

#F4F2F0

Copied #F2F4F0

#F2F4F0

#F2F4F0

Square

Four colors evenly spaced 90° apart

Copied #F1F3F5

#F1F3F5

#F1F3F5

Copied #F4F0F4

#F4F0F4

#F4F0F4

Copied #F4F2F0

#F4F2F0

#F4F2F0

Copied #F0F4F0

#F0F4F0

#F0F4F0

Gray 1 in every color space

Full conversion of Gray 1 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

#F1F3F5

RGB

rgb(241, 243, 245)

CMYK

cmyk(2%, 1%, 0%, 4%)

HSL

hsl(210, 17%, 95%)

HSV

hsv(210, 2%, 96%)

HWB

hwb(210 95% 4%)

CIE Lab

lab(95.7 -0.3 -1.2)

OKLCH

oklch(96.3% 0.003 247.9)

XYZ (D65)

xyz(84.80, 89.39, 99.16)

Copy-ready code for Gray 1

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: #F1F3F5;
background-color: #F1F3F5;

CSS variable

:root {
  --color-gray-1: #F1F3F5;
}

Tailwind config

// tailwind.config.js
colors: {
  'gray-1': '#F1F3F5',
}

Sass

$color-gray-1: #F1F3F5;

Swift UIColor

UIColor(red: 0.945, green: 0.953, blue: 0.961, alpha: 1.0)

Android XML

<color name="gray-1">#F1F3F5</color>

Closest match in every color system

The nearest Gray 1 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 #F4F4F4

RAL 9003

#F4F4F4

Signal white

Copied #F6F6F6

RAL 9016

#F6F6F6

Traffic white

Copied #FFFFFF

RAL 9010

#FFFFFF

Pure white

Copied #D7D7D7

RAL 7035

#D7D7D7

Light grey

Copied #D7D7D7

RAL 9018

#D7D7D7

Papyrus white

Copied #FDF4E3

RAL 9001

#FDF4E3

Cream

FAQ about Gray 1

What is the HEX code for Gray 1?

Gray 1 (gray-1) has the HEX code #F1F3F5. In RGB it is rgb(241, 243, 245), and in CMYK it is cmyk(2%, 1%, 0%, 4%).

What is the OKLCH value of Gray 1?

Gray 1 converts to oklch(0.963 0.003 247.9). OKLCH is the perceptually uniform color space used by Tailwind v4 and CSS Color Module Level 4.

Is Gray 1 accessible for body text?

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

What is the closest Pantone to Gray 1?

The closest Pantone reference to Gray 1 by ΔE2000 perceptual distance is Pantone Cool Gray 1 C (#D9D9D6). 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 1?

The closest RAL Classic reference to Gray 1 by ΔE2000 distance is RAL 9003 (Signal white, #F4F4F4). RAL is a German industrial coating standard commonly used for paint, powder coat, and architectural specification.

What is the complementary color of Gray 1?

The complementary color (180° opposite on the HSL color wheel) of Gray 1 is #F4F2F0. 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
blue

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

Open Color · Gray 1 — #F1F3F5 | PantoneTools