#676AFC

#676AFC

Color Values

HEX

#676AFC

RGB

103, 106, 252

HSL

238.8, 96.1%, 69.6%

HSV

238.8, 59.1%, 98.8%

CMYK

59.1%, 57.9%, 0.0%, 1.2%

OKLCH

0.6032 0.2125 277.0

Properties

Cool Light Nearest: slateblue 1

Color Harmonies

Complementary

#676AFC

#FCF967

Analogous

#67B4FC

#AF67FC

#676AFC

Triadic

#676AFC

#FC676A

#6AFC67

Split Complementary

#676AFC

#FCAF67

#B4FC67

Tetradic

#676AFC

#FC67B4

#FCF967

#67FCAF

Color Blindness Simulation

Original

#676AFC

Protanopia

#6868D9

Deuteranopia

#6868D0

Tritanopia

#67BDB7

Achromatopsia

#747474

CSS Usage

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

Tailwind Shades

50
#F1F1FE
100
#DFDFFC
200
#B9BAFE
300
#8789FD
400
#464AFB
500
#050AFA
600
#0408C8
700
#0306A0
800
#02057D
900
#07085A
950
#040539

Contrast Checker

Text on white

4.16:1

AA Fail AAA Fail

Text on black

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