#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

Feb 01, 2026
Tutorials

Responsive Color: Adapting Colors for Different Screens

Jan 23, 2026
Tutorials

Color for Data Storytelling: Beyond Default Chart Colors

Jan 21, 2026