HEX Color #CC1657 (Crimson)

About #CC1657

The precise color #CC1657 is an excellent choice for modern design projects. Designers often compare it to the standard color Crimson. To achieve this exact tint on a monitor, you would use an RGB mix of 204, 22, and 87.

While screens use RGB, printing presses rely on Cyan, Magenta, Yellow, and Key (black). To reproduce this shade on paper, a printer utilizes 0% cyan and 89% magenta inks. This makes it a relatively light color when applied to physical surfaces.

Web Content Accessibility Guidelines (WCAG) dictate how we should use this color. Mathematical luminance calculations suggest that #FFFFFF text provides the most optimal reading experience. You can view the detailed AAA and AA pass/fail metrics in the table below.

Color Space Conversions

HEX#CC1657

RGB204, 22, 87

HSL338.6°, 80.5%, 44.3%

CMYK0%, 89%, 57%, 20%

HSV338.6°, 89.2%, 80.0%

LAB44.4, 68.1, 12.9

XYZ26.9, 14.1, 10.3

Decimal13375063

Color Harmonies

Complementary

#CC1657 #16CC8B

Analogous

#CC16B1 #CC3016

Triadic

#56CC16 #1656CC

Tetradic

#B1CC16 #16CC8B #3016CC

Tints, Shades & Tones

Tints (Adding White)

#CC1657

#D12F69

#D7497C

#DD638F

#E27DA1

#E897B4

#EEB1C7

#F3CBD9

#F9E5EC

#FFFFFF

Shades (Adding Black)

#CC1657

#B5134D

#9E1143

#880E3A

#710C30

#5A0926

#44071D

#2D0413

#160209

#000000

WCAG Contrast Accessibility

5.50:1

Text on #FFFFFF

AA

3.82:1

Text on #000000

AA Large

5.25:1

Text on #F8FAFC

AA

3.25:1

Text on #0F172A

AA Large

CSS Implementation

.bg-color { background-color: #CC1657; }

.text-color { color: #CC1657; }

.border-color { border: 2px solid #CC1657; }

Similar Colors

Crimson

#DC143C