#686AFC

#686AFC

Color Values

HEX

#686AFC

RGB

104, 106, 252

HSL

239.2, 96.1%, 69.8%

HSV

239.2, 58.7%, 98.8%

CMYK

58.7%, 57.9%, 0.0%, 1.2%

OKLCH

0.6039 0.2123 277.4

Properties

Cool Light Nearest: slateblue 1

Color Harmonies

Complementary

#686AFC

#FCFA68

Analogous

#68B4FC

#B068FC

#686AFC

Triadic

#686AFC

#FC686A

#6AFC68

Split Complementary

#686AFC

#FCB068

#B4FC68

Tetradic

#686AFC

#FC68B4

#FCFA68

#68FCB0

Color Blindness Simulation

Original

#686AFC

Protanopia

#6969D9

Deuteranopia

#6969D0

Tritanopia

#68BDB7

Achromatopsia

#747474

CSS Usage

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

Tailwind Shades

50
#F1F1FE
100
#DFDFFC
200
#B9BAFE
300
#8789FD
400
#4648FB
500
#0508FA
600
#0407C8
700
#0305A0
800
#02047D
900
#07085A
950
#040539

Contrast Checker

Text on white

4.15:1

AA Fail AAA Fail

Text on black

5.06: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