Periwinkle

#CCCCFF
RGB
204, 204, 255
HSL
240°, 100%, 90%
CMYK
20, 20, 0, 0
HSV
240°, 20%, 100%

Similar Colors

Conversions & Codes

Format Value CSS
HEX #CCCCFF color: #CCCCFF;
RGB 204, 204, 255 color: rgb(204, 204, 255);
RGB Percentage 80%, 80%, 100% color: rgb(80%, 80%, 100%);
CMYK 20%, 20%, 0%, 0% Not supported in CSS
HSL 240°, 100%, 90% color: hsl(240, 100%, 90%);
HSV 240°, 20%, 100% Not supported in CSS
CIE-LAB 72, 0, -17 color: lab(72% 0 -17);
Decimal 13421823 Not supported in CSS

Color Variations

Shades

#CCCCFF
#9E9EFF
#7070FF
#4242FF
#1414FF
#0000E6
#0000B8
#00008A

Tints

#F0F0FF
#EBEBFF
#E6E6FF
#E0E0FF
#DBDBFF
#D6D6FF
#D1D1FF
#CCCCFF

Tones

#CCCCFF
#CFCFFC
#D1D1FA
#D4D4F7
#D6D6F5
#D9D9F2
#DBDBF0
#DEDEED

Hues

#CCCCFF
#F2CCFF
#FFCCE6
#FFD9CC
#FFFFCC
#D9FFCC
#CCFFE6
#CCF2FF

Color Harmonies

Analogous

#CCE6FF
Click to copy
Light Cyan
94%
#CCCCFF
Click to copy
Periwinkle
100%
#E6CCFF
Click to copy
Light Purple
94%

Complementary

#CCCCFF
Click to copy
Periwinkle
100%
#FFFFCC
Click to copy
Light Yellow
80%

Split Complementary

#CCCCFF
Click to copy
Periwinkle
100%
#FFE6CC
Click to copy
Light Orange
83%
#E6FFCC
Click to copy
Light Yellow
83%

Triadic

#CCCCFF
Click to copy
Periwinkle
100%
#FFCCCC
Click to copy
Light Red
84%
#CCFFCC
Click to copy
Light Green
84%

Tetradic

#CCCCFF
Click to copy
Periwinkle
100%
#FFCCE6
Click to copy
Light Purple
87%
#FFFFCC
Click to copy
Light Yellow
80%
#CCFFE6
Click to copy
Light Cyan
87%

Square

#CCCCFF
Click to copy
Periwinkle
100%
#FFCCE6
Click to copy
Light Purple
87%
#FFFFCC
Click to copy
Light Yellow
80%
#CCFFE6
Click to copy
Light Cyan
87%

CSS & Dev Snippets

CSS
.periwinkle {
  color: #CCCCFF;
}
SCSS
$periwinkle: #CCCCFF;
RGB
rgb(204, 204, 255)

Accessibility & Contrast

White background

1.54:1
1.54
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

13.65:1
13.65
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags