#676CFA

#676CFA

Color Values

HEX

#676CFA

RGB

103, 108, 250

HSL

238.0, 93.6%, 69.2%

HSV

238.0, 58.8%, 98.0%

CMYK

58.8%, 56.8%, 0.0%, 2.0%

OKLCH

0.6052 0.2075 276.7

Properties

Cool Light Nearest: slateblue 1

Color Harmonies

Complementary

#676CFA

#FAF567

Analogous

#67B5FA

#AC67FA

#676CFA

Triadic

#676CFA

#FA676C

#6CFA67

Split Complementary

#676CFA

#FAAC67

#B5FA67

Tetradic

#676CFA

#FA67B5

#FAF567

#67FAAC

Color Blindness Simulation

Original

#676CFA

Protanopia

#6969D8

Deuteranopia

#6968CF

Tritanopia

#67BCB7

Achromatopsia

#757575

CSS Usage

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

Tailwind Shades

50
#F1F2FD
100
#DFE0FB
200
#BABCFD
300
#898CFB
400
#484EF9
500
#0810F7
600
#070DC5
700
#050A9E
800
#04087B
900
#080A59
950
#050738

Contrast Checker

Text on white

4.12:1

AA Fail AAA Fail

Text on black

5.1:1

AA Pass AAA Fail

Related Articles

Tutorials

Responsive Color: Adapting Colors for Different Screens

Jan 23, 2026
Tutorials

Color for Data Storytelling: Beyond Default Chart Colors

Jan 21, 2026
Tutorials

How to Choose Brand Colors: A Step-by-Step Guide

Jan 18, 2026