#686CE2

#686CE2

Color Values

HEX

#686CE2

RGB

104, 108, 226

HSL

238.0, 67.8%, 64.7%

HSV

238.0, 54.0%, 88.6%

CMYK

54.0%, 52.2%, 0.0%, 11.4%

OKLCH

0.5888 0.1756 278.1

Properties

Cool Light Nearest: royalblue

Color Harmonies

Complementary

#686CE2

#E2DE68

Analogous

#68A9E2

#A168E2

#686CE2

Triadic

#686CE2

#E2686C

#6CE268

Split Complementary

#686CE2

#E2A168

#A9E268

Tetradic

#686CE2

#E268A9

#E2DE68

#68E2A1

Color Blindness Simulation

Original

#686CE2

Protanopia

#6A6AC5

Deuteranopia

#6A69BF

Tritanopia

#68AFAA

Achromatopsia

#747474

CSS Usage

background-color: #686CE2;
color: #686CE2;
border-color: #686CE2;
Nearest Tailwind: Indigo 500 #6366F1

Tailwind Shades

50
#F3F3FC
100
#E3E4F7
200
#C3C5F4
300
#989BEB
400
#6165E1
500
#292FD6
600
#2125AB
700
#1A1E89
800
#15176B
900
#13154E
950
#0C0D31

Contrast Checker

Text on white

4.35:1

AA Fail AAA Fail

Text on black

4.83:1

AA Pass AAA Fail

Related Articles

Brand Stories

Pantone Colors by Decade: The 2000s, 2010s, and 2020s Compared

ก.พ. 01, 2026
Tutorials

Responsive Color: Adapting Colors for Different Screens

ม.ค. 23, 2026
Tutorials

Color for Data Storytelling: Beyond Default Chart Colors

ม.ค. 21, 2026