#507DC3#507DC3

#507DC3 is a mid, moderate blue. Relative luminance 0.203; OKLCH L 58.9% C 0.119 H 258.9°. Best body text is #000000 at 5.06:1 contrast (WCAG AA passes).

Color values

HEX#507DC3
RGBrgb(80, 125, 195)
HSLhsl(217, 49%, 54%)
HSVhsv(217, 59%, 76%)
CMYKcmyk(59%, 35.9%, 0%, 23.5%)
CIE-LABlab(52.19, 5.89, -41.19)
CIE-LCHlch(52.19, 41.61, 278.13°)
OKLaboklab(58.94% -0.0228 -0.1166)
OKLCHoklch(58.94% 0.119 258.9)
XYZxyz(20.4888, 20.3111, 54.4599)
Luminance0.2031 (WCAG relative)
Temperaturecool
Familyblue

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary
#507DC3 #C39650
analogous
#50B7C3 #507DC3 #5D50C3
triadic
#507DC3 #C3507D #7DC350
tetradic
#507DC3 #C350B7 #C39650 #50C35D
square
#507DC3 #C350B7 #C39650 #50C35D
split-complementary
#507DC3 #C35D50 #B7C350
monochromatic
#274472 #37609F #507DC3 #7E9FD3 #ABC1E2

Accessibility & contrast

On white

4.15
#507DC3 on #FFFFFF
AA ✗AA large ✓AAA ✗

On black

5.06
#507DC3 on #000000
AA ✓AA large ✓AAA ✗

Best text color

#000000 on #507DC3
5.06:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg##507DC3#FFFFFF#000000##000000
##507DC31.004.155.065.06
#FFFFFF4.151.0021.0021.00
#0000005.0621.001.001.00
##0000005.0621.001.001.00

Color blindness preview

Protanopia (red-blind)
#6082C6
Deuteranopia (green-blind)
#5178C2
Tritanopia (blue-blind)
#008D97
Achromatopsia (no color)
#7C7C7C

Design tokens & code

CSS
--color: #507dc3;
/* rgb */ color: rgb(80, 125, 195);
/* oklch */ color: oklch(58.9% 0.119 258.9);
Tailwind
colors: {
  custom: {
    50: '#8aa2d5',
    500: '#507dc3',
    950: '#000000',
  },
}
SCSS
$custom: #507dc3;
$custom-light: #8aa2d5;
$custom-dark: #000000;
JSON
{
  "hex": "#507dc3",
  "rgb": {
    "r": 80,
    "g": 125,
    "b": 195
  },
  "hsl": {
    "h": 216.522,
    "s": 48.936,
    "l": 53.922
  },
  "oklch": {
    "l": 0.58941,
    "c": 0.11885,
    "h": 258.9
  },
  "luminance": 0.20313
}

Semantic roles & 50–950 ramp

primary
#507DC3
secondary
#D0BD9F
accent
#A34FD8
background
#F8F9FD
surface
#F0F2FA
border
#CBCCD3
text
#0C0F14
muted
#7D7E83

Preview Lab

Preview with #507DC3

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

Preview Lab → · Contrast checker → · Palette generator →

#507DC3 Color — HEX, RGB, HSL, OKLCH & Contrast — Tintiva