Skip to content
PantoneTools
blue
Open Color

Indigo 2

indigo-2 · #BAC8FF

HEX

#BAC8FF

RGB

rgb(186, 200, 255)

CMYK

cmyk(27%, 22%, 0%, 0%)

HSL

hsl(228, 100%, 86%)

LAB

lab(81.3, 7.1, -28.5)

What is Indigo 2?

Indigo 2 is the indigo-2 reference in the Open Color. Its sRGB value is #BAC8FF (rgb 186, 200, 255). 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 Indigo 2 as a background.

Black text on this color

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

White text on this color

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

Shades, tints & tonal scale of Indigo 2

An 11-step tonal scale derived from Indigo 2 (#BAC8FF). 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 #F9FBFF

50

#F9FBFF

#F9FBFF

Copied #F4F6FF

100

#F4F6FF

#F4F6FF

Copied #E9EDFF

200

#E9EDFF

#E9EDFF

Copied #DDE4FF

300

#DDE4FF

#DDE4FF

Copied #CBD6FF

400

#CBD6FF

#CBD6FF

Copied #BAC8FF

500

#BAC8FF

#BAC8FF

Copied #9EAAD9

600

#9EAAD9

#9EAAD9

Copied #7982A6

700

#7982A6

#7982A6

Copied #545A73

800

#545A73

#545A73

Copied #2F3240

900

#2F3240

#2F3240

Copied #16181F

950

#16181F

#16181F

Lighter tints (mixed with white)

Copied #C6D1FF

15%

#C6D1FF

Copied #D2DAFF

30%

#D2DAFF

Copied #DDE3FF

45%

#DDE3FF

Copied #E7EBFF

60%

#E7EBFF

Copied #F0F3FF

75%

#F0F3FF

Darker shades (mixed with black)

Copied #ADBAED

15%

#ADBAED

Copied #9EAADA

30%

#9EAADA

Copied #8E99C4

45%

#8E99C4

Copied #7B84AA

60%

#7B84AA

Copied #626A89

75%

#626A89

Color harmonies for Indigo 2

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

Complementary

180° opposite — strongest contrast

Copied #BAC8FF

#BAC8FF

#BAC8FF

Copied #FFF1B8

#FFF1B8

#FFF1B8

Triadic

Three colors 120° apart

Copied #BAC8FF

#BAC8FF

#BAC8FF

Copied #FFB8C6

#FFB8C6

#FFB8C6

Copied #C6FFB8

#C6FFB8

#C6FFB8

Analogous

Two neighbors ±30° on the wheel

Copied #B8EAFF

#B8EAFF

#B8EAFF

Copied #BAC8FF

#BAC8FF

#BAC8FF

Copied #CDB8FF

#CDB8FF

#CDB8FF

Split-complementary

Base + two colors flanking its complement

Copied #BAC8FF

#BAC8FF

#BAC8FF

Copied #FFCDB8

#FFCDB8

#FFCDB8

Copied #EAFFB8

#EAFFB8

#EAFFB8

Tetradic

Two complementary pairs

Copied #BAC8FF

#BAC8FF

#BAC8FF

Copied #F1B8FF

#F1B8FF

#F1B8FF

Copied #FFF1B8

#FFF1B8

#FFF1B8

Copied #C6FFB8

#C6FFB8

#C6FFB8

Square

Four colors evenly spaced 90° apart

Copied #BAC8FF

#BAC8FF

#BAC8FF

Copied #FFB8EA

#FFB8EA

#FFB8EA

Copied #FFF1B8

#FFF1B8

#FFF1B8

Copied #B8FFCD

#B8FFCD

#B8FFCD

Indigo 2 in every color space

Full conversion of Indigo 2 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

#BAC8FF

RGB

rgb(186, 200, 255)

CMYK

cmyk(27%, 22%, 0%, 0%)

HSL

hsl(228, 100%, 86%)

HSV

hsv(228, 27%, 100%)

HWB

hwb(228 73% 0%)

CIE Lab

lab(81.3 7.1 -28.5)

OKLCH

oklch(84.1% 0.079 273.5)

XYZ (D65)

xyz(58.95, 58.97, 102.86)

Copy-ready code for Indigo 2

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

CSS variable

:root {
  --color-indigo-2: #BAC8FF;
}

Tailwind config

// tailwind.config.js
colors: {
  'indigo-2': '#BAC8FF',
}

Sass

$color-indigo-2: #BAC8FF;

Swift UIColor

UIColor(red: 0.729, green: 0.784, blue: 1.000, alpha: 1.0)

Android XML

<color name="indigo-2">#BAC8FF</color>

Closest match in every color system

The nearest Indigo 2 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 #9DA1AA

RAL 7040

#9DA1AA

Window grey

Copied #D7D7D7

RAL 7035

#D7D7D7

Light grey

Copied #D7D7D7

RAL 9018

#D7D7D7

Papyrus white

Copied #F4F4F4

RAL 9003

#F4F4F4

Signal white

Copied #F6F6F6

RAL 9016

#F6F6F6

Traffic white

Copied #8F999F

RAL 7001

#8F999F

Silver grey

FAQ about Indigo 2

What is the HEX code for Indigo 2?

Indigo 2 (indigo-2) has the HEX code #BAC8FF. In RGB it is rgb(186, 200, 255), and in CMYK it is cmyk(27%, 22%, 0%, 0%).

What is the OKLCH value of Indigo 2?

Indigo 2 converts to oklch(0.841 0.079 273.5). OKLCH is the perceptually uniform color space used by Tailwind v4 and CSS Color Module Level 4.

Is Indigo 2 accessible for body text?

Used as a background, Indigo 2 has a contrast ratio of 12.79:1 with black text and 1.64: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 Indigo 2?

The closest Pantone reference to Indigo 2 by ΔE2000 perceptual distance is Pantone 291 C (#9BCBEB). Cross-system Pantone matching is approximate; for color-critical print work, verify with a physical Pantone guide.

What is the closest RAL color to Indigo 2?

The closest RAL Classic reference to Indigo 2 by ΔE2000 distance is RAL 7040 (Window grey, #9DA1AA). RAL is a German industrial coating standard commonly used for paint, powder coat, and architectural specification.

What is the complementary color of Indigo 2?

The complementary color (180° opposite on the HSL color wheel) of Indigo 2 is #FFF1B8. 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 · Indigo 2 — #BAC8FF | PantoneTools