#686AE9

#686AE9

Color Values

HEX

#686AE9

RGB

104, 106, 233

HSL

239.1, 74.6%, 66.1%

HSV

239.1, 55.4%, 91.4%

CMYK

55.4%, 54.5%, 0.0%, 8.6%

OKLCH

0.59 0.1875 278.3

Properties

Cool Light Nearest: mediumslateblue

Color Harmonies

Complementary

#686AE9

#E9E768

Analogous

#68AAE9

#A768E9

#686AE9

Triadic

#686AE9

#E9686A

#6AE968

Split Complementary

#686AE9

#E9A768

#AAE968

Tetradic

#686AE9

#E968AA

#E9E768

#68E9A7

Color Blindness Simulation

Original

#686AE9

Protanopia

#6969CA

Deuteranopia

#6969C3

Tritanopia

#68B2AD

Achromatopsia

#737373

CSS Usage

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

Tailwind Shades

50
#F2F3FC
100
#E2E2F8
200
#C1C1F6
300
#9496EF
400
#5A5CE7
500
#2023DF
600
#1A1CB2
700
#15178E
800
#10126F
900
#101151
950
#0A0B33

Contrast Checker

Text on white

4.35:1

AA Fail AAA Fail

Text on black

4.83:1

AA Pass AAA Fail

Related Articles

Tutorials

Building a Color Picker Web Component from Scratch

Feb 20, 2026
Tutorials

Web Color Performance: Gradients, Shadows, and Filters

Feb 19, 2026
Tutorials

Tailwind CSS Colors: Complete Shade System Guide

Feb 19, 2026