#568AF6#568AF6

#568AF6 is a light, vivid blue. Relative luminance 0.268; OKLCH L 65.0% C 0.171 H 263.1°. Best body text is #000000 at 6.36:1 contrast (WCAG AA passes).

Color values

HEX#568AF6
RGBrgb(86, 138, 246)
HSLhsl(221, 90%, 65%)
HSVhsv(221, 65%, 96%)
CMYKcmyk(65%, 43.9%, 0%, 3.5%)
CIE-LABlab(58.79, 16.35, -59.29)
CIE-LCHlch(58.79, 61.50, 285.42°)
OKLaboklab(65.02% -0.0204 -0.1694)
OKLCHoklch(65.02% 0.171 263.1)
XYZxyz(29.5549, 26.8064, 90.7875)
Luminance0.2681 (WCAG relative)
Temperaturecool
Familyblue

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary
#568AF6 #F6C256
analogous
#56DAF6 #568AF6 #7256F6
triadic
#568AF6 #F6568A #8AF656
tetradic
#568AF6 #F656DA #F6C256 #56F672
square
#568AF6 #F656DA #F6C256 #56F672
split-complementary
#568AF6 #F67256 #DAF656
monochromatic
#0B48C7 #1C62F3 #568AF6 #90B2F9 #CADAFC

Accessibility & contrast

On white

3.30
#568AF6 on #FFFFFF
AA ✗AA large ✓AAA ✗

On black

6.36
#568AF6 on #000000
AA ✓AA large ✓AAA ✗

Best text color

#000000 on #568AF6
6.36:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg##568AF6#FFFFFF#000000##000000
##568AF61.003.306.366.36
#FFFFFF3.301.0021.0021.00
#0000006.3621.001.001.00
##0000006.3621.001.001.00

Color blindness preview

Protanopia (red-blind)
#5695FA
Deuteranopia (green-blind)
#3A87F4
Tritanopia (blue-blind)
#00A3B4
Achromatopsia (no color)
#8D8D8D

Design tokens & code

CSS
--color: #568af6;
/* rgb */ color: rgb(86, 138, 246);
/* oklch */ color: oklch(65.0% 0.171 263.1);
Tailwind
colors: {
  custom: {
    50: '#95abfa',
    500: '#568af6',
    950: '#000000',
  },
}
SCSS
$custom: #568af6;
$custom-light: #95abfa;
$custom-dark: #000000;
JSON
{
  "hex": "#568af6",
  "rgb": {
    "r": 86,
    "g": 138,
    "b": 246
  },
  "hsl": {
    "h": 220.5,
    "s": 89.888,
    "l": 65.098
  },
  "oklch": {
    "l": 0.65023,
    "c": 0.17063,
    "h": 263.1
  },
  "luminance": 0.26809
}

Semantic roles & 50–950 ramp

primary
#568AF6
secondary
#EFDDB9
accent
#9B00E6
background
#F9FAFF
surface
#F2F4FF
border
#CCCED7
text
#0F1017
muted
#7E7F85

Preview Lab

Preview with #568AF6

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

Preview Lab → · Contrast checker → · Palette generator →

#568AF6 Color — HEX, RGB, HSL, OKLCH & Contrast — Tintiva