#676BE5

#676BE5

Color Values

HEX

#676BE5

RGB

103, 107, 229

HSL

238.1, 70.8%, 65.1%

HSV

238.1, 55.0%, 89.8%

CMYK

55.0%, 53.3%, 0.0%, 10.2%

OKLCH

0.5883 0.1811 277.9

Properties

Cool Light Nearest: royalblue

Color Harmonies

Complementary

#676BE5

#E5E167

Analogous

#67AAE5

#A267E5

#676BE5

Triadic

#676BE5

#E5676B

#6BE567

Split Complementary

#676BE5

#E5A267

#AAE567

Tetradic

#676BE5

#E567AA

#E5E167

#67E5A2

Color Blindness Simulation

Original

#676BE5

Protanopia

#6969C8

Deuteranopia

#6868C0

Tritanopia

#67B0AB

Achromatopsia

#737373

CSS Usage

background-color: #676BE5;
color: #676BE5;
border-color: #676BE5;
Nearest Tailwind: Indigo 500 #6366F1

Tailwind Shades

50
#F3F3FC
100
#E2E3F8
200
#C2C4F5
300
#9699ED
400
#5E62E3
500
#252BDA
600
#1E22AE
700
#181B8B
800
#13156D
900
#12144F
950
#0B0C32

Contrast Checker

Text on white

4.36:1

AA Fail AAA Fail

Text on black

4.81:1

AA Pass AAA Fail

Related Articles

Tutorials

CSS color-mix(): Blend Colors Natively in the Browser

Jan 26, 2026
Tutorials

Building a Color Picker Web Component from Scratch

Jan 21, 2026
Tutorials

Perceptual Color Spaces: Lab, LCH, Oklab, OKLCH

Jan 15, 2026