#7684F9

#7684F9

Color Values

HEX

#7684F9

RGB

118, 132, 249

HSL

233.6, 91.6%, 72.0%

HSV

233.6, 52.6%, 97.6%

CMYK

52.6%, 47.0%, 0.0%, 2.4%

OKLCH

0.6581 0.1725 275.5

Properties

Cool Light Nearest: royalblue

Color Harmonies

Complementary

#7684F9

#F9EB76

Analogous

#76C6F9

#AA76F9

#7684F9

Triadic

#7684F9

#F97684

#84F976

Split Complementary

#7684F9

#F9AA76

#C6F976

Tetradic

#7684F9

#F976C6

#F9EB76

#76F9AA

Color Blindness Simulation

Original

#7684F9

Protanopia

#7C7CDD

Deuteranopia

#7B7AD6

Tritanopia

#77C6C1

Achromatopsia

#898989

CSS Usage

background-color: #7684F9;
color: #7684F9;
border-color: #7684F9;
Nearest Tailwind: Indigo 400 #818CF8

Tailwind Shades

50
#F1F3FD
100
#DFE2FB
200
#BBC2FC
300
#8A96FA
400
#4A5DF7
500
#0B24F4
600
#091DC3
700
#07179C
800
#05127A
900
#091158
950
#050B38

Contrast Checker

Text on white

3.26:1

AA Fail AAA Fail

Text on black

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