#677BAE

#677BAE

Color Values

HEX

#677BAE

RGB

103, 123, 174

HSL

223.1, 30.5%, 54.3%

HSV

223.1, 40.8%, 68.2%

CMYK

40.8%, 29.3%, 0.0%, 31.8%

OKLCH

0.5878 0.0821 267.4

Properties

Cool Light Nearest: steelblue

Color Harmonies

Complementary

#677BAE

#AE9A67

Analogous

#679EAE

#7667AE

#677BAE

Triadic

#677BAE

#AE677B

#7BAE67

Split Complementary

#677BAE

#AE7667

#9EAE67

Tetradic

#677BAE

#AE679E

#AE9A67

#67AE76

Color Blindness Simulation

Original

#677BAE

Protanopia

#7070A2

Deuteranopia

#6E6D9F

Tritanopia

#689896

Achromatopsia

#7A7A7A

CSS Usage

background-color: #677BAE;
color: #677BAE;
border-color: #677BAE;
Nearest Tailwind: Sky 700 #0369A1

Tailwind Shades

50
#F5F6F9
100
#E9EBF2
200
#D0D7E6
300
#AFBAD4
400
#8494BD
500
#596FA6
600
#475885
700
#39476A
800
#2C3753
900
#232B3E
950
#161B27

Contrast Checker

Text on white

4.18:1

AA Fail AAA Fail

Text on black

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