#386FAE#386FAE

#386FAE is a mid, moderate cyan. Relative luminance 0.153; OKLCH L 53.5% C 0.115 H 253.4°. Best body text is #FFFFFF at 5.18:1 contrast (WCAG AA passes).

Color values

HEX#386FAE
RGBrgb(56, 111, 174)
HSLhsl(212, 51%, 45%)
HSVhsv(212, 68%, 68%)
CMYKcmyk(67.8%, 36.2%, 0%, 31.8%)
CIE-LABlab(45.99, 2.70, -38.93)
CIE-LCHlch(45.99, 39.02, 273.97°)
OKLaboklab(53.47% -0.0329 -0.1105)
OKLCHoklch(53.47% 0.115 253.4)
XYZxyz(14.9525, 15.2641, 42.1944)
Luminance0.1527 (WCAG relative)
Temperaturecool
Familycyan

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary
#386FAE #AE7738
analogous
#38AAAE #386FAE #3C38AE
triadic
#386FAE #AE386F #6FAE38
tetradic
#386FAE #AE38AA #AE7738 #38AE3C
square
#386FAE #AE38AA #AE7738 #38AE3C
split-complementary
#386FAE #AE3C38 #AAAE38
monochromatic
#1A3451 #295180 #386FAE #598ECA #88ADD9

Accessibility & contrast

On white

5.18
#386FAE on #FFFFFF
AA ✓AA large ✓AAA ✗

On black

4.05
#386FAE on #000000
AA ✗AA large ✓AAA ✗

Best text color

#FFFFFF on #386FAE
5.18:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg##386FAE#FFFFFF#000000##FFFFFF
##386FAE1.005.184.055.18
#FFFFFF5.181.0021.001.00
#0000004.0521.001.0021.00
##FFFFFF5.181.0021.001.00

Color blindness preview

Protanopia (red-blind)
#5373B1
Deuteranopia (green-blind)
#4268AD
Tritanopia (blue-blind)
#007E86
Achromatopsia (no color)
#6D6D6D

Design tokens & code

CSS
--color: #386fae;
/* rgb */ color: rgb(56, 111, 174);
/* oklch */ color: oklch(53.5% 0.115 253.4);
Tailwind
colors: {
  custom: {
    50: '#7b98c6',
    500: '#386fae',
    950: '#000000',
  },
}
SCSS
$custom: #386fae;
$custom-light: #7b98c6;
$custom-dark: #000000;
JSON
{
  "hex": "#386fae",
  "rgb": {
    "r": 56,
    "g": 111,
    "b": 174
  },
  "hsl": {
    "h": 212.034,
    "s": 51.304,
    "l": 45.098
  },
  "oklch": {
    "l": 0.53465,
    "c": 0.11533,
    "h": 253.4
  },
  "luminance": 0.15266
}

Semantic roles & 50–950 ramp

primary
#386FAE
secondary
#C3A37F
accent
#994DDB
background
#F8F9FC
surface
#EFF2F8
border
#CACCD1
text
#0A0D13
muted
#7C7E82

Preview Lab

Preview with #386FAE

Body copy rendered with the generated semantic roles for this colour.

Preview Lab → · Contrast checker → · Palette generator →

#386FAE Color — HEX, RGB, HSL, OKLCH & Contrast — Tintiva