Skip to content
PantoneTools
blue
Open Color

Blue 6

blue-6 · #228BE6

HEX

#228BE6

RGB

rgb(34, 139, 230)

CMYK

cmyk(85%, 40%, 0%, 10%)

HSL

hsl(208, 80%, 52%)

LAB

lab(56.6, 3.8, -54.0)

What is Blue 6?

Blue 6 is the blue-6 reference in the Open Color. Its sRGB value is #228BE6 (rgb 34, 139, 230). 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 Blue 6 as a background.

Black text on this color

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

White text on this color

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

Shades, tints & tonal scale of Blue 6

An 11-step tonal scale derived from Blue 6 (#228BE6). 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 #EDF6FD

50

#EDF6FD

#EDF6FD

Copied #DCECFB

100

#DCECFB

#DCECFB

Copied #B8DAF7

200

#B8DAF7

#B8DAF7

Copied #91C5F3

300

#91C5F3

#91C5F3

Copied #59A8EC

400

#59A8EC

#59A8EC

Copied #228BE6

500

#228BE6

#228BE6

Copied #1D76C4

600

#1D76C4

#1D76C4

Copied #165A96

700

#165A96

#165A96

Copied #0F3F68

800

#0F3F68

#0F3F68

Copied #09233A

900

#09233A

#09233A

Copied #04111C

950

#04111C

#04111C

Lighter tints (mixed with white)

Copied #71A4EA

15%

#71A4EA

Copied #97B8EE

30%

#97B8EE

Copied #B4CAF2

45%

#B4CAF2

Copied #CCDAF5

60%

#CCDAF5

Copied #E1E9F9

75%

#E1E9F9

Darker shades (mixed with black)

Copied #1F81D6

15%

#1F81D6

Copied #1B76C4

30%

#1B76C4

Copied #1769B0

45%

#1769B0

Copied #135A99

60%

#135A99

Copied #0D487B

75%

#0D487B

Color harmonies for Blue 6

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

Complementary

180° opposite — strongest contrast

Copied #228BE6

#228BE6

#228BE6

Copied #E77E23

#E77E23

#E77E23

Triadic

Three colors 120° apart

Copied #228BE6

#228BE6

#228BE6

Copied #E7238B

#E7238B

#E7238B

Copied #8BE723

#8BE723

#8BE723

Analogous

Two neighbors ±30° on the wheel

Copied #23E7E0

#23E7E0

#23E7E0

Copied #228BE6

#228BE6

#228BE6

Copied #2329E7

#2329E7

#2329E7

Split-complementary

Base + two colors flanking its complement

Copied #228BE6

#228BE6

#228BE6

Copied #E72329

#E72329

#E72329

Copied #E7E023

#E7E023

#E7E023

Tetradic

Two complementary pairs

Copied #228BE6

#228BE6

#228BE6

Copied #7E23E7

#7E23E7

#7E23E7

Copied #E77E23

#E77E23

#E77E23

Copied #8BE723

#8BE723

#8BE723

Square

Four colors evenly spaced 90° apart

Copied #228BE6

#228BE6

#228BE6

Copied #E023E7

#E023E7

#E023E7

Copied #E77E23

#E77E23

#E77E23

Copied #29E723

#29E723

#29E723

Blue 6 in every color space

Full conversion of Blue 6 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

#228BE6

RGB

rgb(34, 139, 230)

CMYK

cmyk(85%, 40%, 0%, 10%)

HSL

hsl(208, 80%, 52%)

HSV

hsv(208, 85%, 90%)

HWB

hwb(208 13% 10%)

CIE Lab

lab(56.6 3.8 -54.0)

OKLCH

oklch(62.6% 0.164 250.3)

XYZ (D65)

xyz(24.17, 24.52, 78.31)

Copy-ready code for Blue 6

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

CSS variable

:root {
  --color-blue-6: #228BE6;
}

Tailwind config

// tailwind.config.js
colors: {
  'blue-6': '#228BE6',
}

Sass

$color-blue-6: #228BE6;

Swift UIColor

UIColor(red: 0.133, green: 0.545, blue: 0.902, alpha: 1.0)

Android XML

<color name="blue-6">#228BE6</color>

Closest match in every color system

The nearest Blue 6 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 #3B83BD

RAL 5012

#3B83BD

Light blue

Copied #2271B3

RAL 5015

#2271B3

Sky blue

Copied #49678D

RAL 5023

#49678D

Distant blue

Copied #7E8B92

RAL 7000

#7E8B92

Squirrel grey

Copied #606E8C

RAL 5014

#606E8C

Pigeon blue

Copied #3E5F8A

RAL 5007

#3E5F8A

Brilliant blue

FAQ about Blue 6

What is the HEX code for Blue 6?

Blue 6 (blue-6) has the HEX code #228BE6. In RGB it is rgb(34, 139, 230), and in CMYK it is cmyk(85%, 40%, 0%, 10%).

What is the OKLCH value of Blue 6?

Blue 6 converts to oklch(0.626 0.164 250.3). OKLCH is the perceptually uniform color space used by Tailwind v4 and CSS Color Module Level 4.

Is Blue 6 accessible for body text?

Used as a background, Blue 6 has a contrast ratio of 5.90:1 with black text and 3.56: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 Blue 6?

The closest Pantone reference to Blue 6 by ΔE2000 perceptual distance is Pantone Process Blue C (#0085CA). Cross-system Pantone matching is approximate; for color-critical print work, verify with a physical Pantone guide.

What is the closest RAL color to Blue 6?

The closest RAL Classic reference to Blue 6 by ΔE2000 distance is RAL 5012 (Light blue, #3B83BD). RAL is a German industrial coating standard commonly used for paint, powder coat, and architectural specification.

What is the complementary color of Blue 6?

The complementary color (180° opposite on the HSL color wheel) of Blue 6 is #E77E23. 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 · Blue 6 — #228BE6 | PantoneTools