#8394C9

Accessibility

AAA

7.04:1

Vs white / black

2.98:1 · 7.04:1

Sources

Library color

Codes

Formats

HEX

#8394c9

RGB

rgb(131, 148, 201)

RGBA

rgba(131, 148, 201, 1)

HSL

hsl(225, 39%, 65%)

HSLA

hsla(225, 39%, 65%, 1)

HSV

hsv(225, 35%, 79%)

LAB

lab(61.84% 6.74 -29.27)

LCH

lch(61.84% 30.04 282.97)

OKLAB

oklab(0.6734 0.0006 -0.0812)

OKLCH

oklch(0.6734 0.0812 270.42)

XYZ

xyz(30.49, 30.22, 59.47)

CMYK

cmyk(35%, 26%, 0%, 21%)

CSS

color: #8394c9;

CSS variable

--color-8394c9: #8394c9;

SCSS

$color-8394c9: #8394c9;

JavaScript

const color = "#8394c9";

TypeScript

const color: string = "#8394c9";

React

style={{ backgroundColor: "#8394c9" }}

JSON

{ "hex": "#8394c9", "rgb": { "r": 131, "g": 148, "b": 201 }, "oklch": "oklch(0.6734 0.0812 270.42)" }

Export

Developer code

css

:root {
  --#8394c9-1: #8394c9;
}

Design systems

Nearest official tokens

An arbitrary HEX is not an official Tailwind, Material, or Bootstrap color. Distance is CIEDE2000.

Nearest Tailwind color

indigo-400

Very different · ΔE 7.16 · #818CF8

Nearest CSS named color

CornflowerBlue

Very different · ΔE 8.2 · #6495ED

Nearest Material color

indigo-300

Noticeably different · ΔE 4.62 · #7986CB

Nearest Bootstrap color

primary

Very different · ΔE 16.13 · #0D6EFD

OKLCH

Perceptual 50–950 scale

Generated in OKLCH from this hex. Not an official Tailwind scale unless the hex itself is a Tailwind token.

50e8f4ff 100dae7ff 200c4d3ff 300acbced 4008e9fd5 5007384b8 600606e9b 7004c587d 800394261 900262e46 95013192d

Palette

Tints & shades

Full scale from light tints through the base color into deep shades

f5f6fb eaedf6 e0e4f2 d6dbed cbd2e9 c1cae4 b7c1e0 acb8db a2afd7 98a6d2 8d9dce 8394c9 7888b8 6d7ba8 626f97 576386 4c5675 424a65 373e54 2c3143 212532 161921 0b0c11

Palette

Tints

Mixed toward white — soft backgrounds and highlights

f5f6fb eaedf6 e0e4f2 d6dbed cbd2e9 c1cae4 b7c1e0 acb8db a2afd7 98a6d2 8d9dce

Palette

Shades

Mixed toward black — depth, text, and emphasis

7888b8 6d7ba8 626f97 576386 4c5675 424a65 373e54 2c3143 212532 161921 0b0c11

Palette

Tones

Mixed toward neutral grey — muted UI surfaces

8392c3 8391bd 828fb7 828db1 828cab 828aa5 81889e 818798 818592 81838c 808286

Harmony

Complementary

Opposite on the color wheel for contrast

#8394C9Stop 1 #C9B783Stop 2

Harmony

Analogous

Neighbors that sit comfortably together

#83B7C9Stop 1 #8394C9Stop 2 #9483C9Stop 3

Harmony

Triadic

Evenly spaced triad for vibrant sets

#8394C9Stop 1 #C98394Stop 2 #94C983Stop 3

Harmony

Split complementary

Base plus two accents beside the complement

#8394C9Stop 1 #C99483Stop 2 #B7C983Stop 3

Harmony

Monochromatic

Same hue, varied lightness and saturation

#1F2947Stop 1 #36487CStop 2 #4E67B1Stop 3 #8394C9Stop 4 #B8C2E0Stop 5

Using this color

Where #8394c9 works

#8394C9 (#8394c9) sits in the blue family at about 225° hue, 39% saturation, and 65% lightness. Contrast is 2.98:1 on white and 7.04:1 on black, so near-black labels read more clearly on the swatch itself. Nearest Tailwind token: indigo-400 (approximation unless the hex is an official scale stop).

Sensible jobs for this swatch

supporting UI accents
text or icons on charcoal / dark mode

Do not use #8394c9 as small body text on white — 2.98:1 misses WCAG AA (4.5:1). Pair it with a darker shade from the scale below, or check pairs in the contrast checker.

Family context: Trust, calm, and professionalism. The most used color in SaaS, finance, and healthcare. Common uses still include buttons, charts, and accents in the Blue range — always verify the pair for this exact hex in the contrast checker.

Similar & related colors

Nearby colors from the library by perceptual distance

Spectrum #7993BE#7993BE Spectrum #929DD3#929DD3 Spectrum #748CCD#748CCD Spectrum #7A88C7#7A88C7 Spectrum #959BD0#959BD0 Spectrum #7F87C3#7F87C3 Material Indigo 300#7986CB Spectrum #91A3D9#91A3D9 Spectrum #7092D2#7092D2 Spectrum #7498C3#7498C3 Spectrum #718BE0#718BE0 Web Safe #9999CC#9999CC