#CCCCFF

Periwinkle

Periwinkle is a soft, pastel indigo-blue named after the periwinkle flower. It blends the calm of blue with the energy of violet.

Periwinkle Color Values

HEX#CCCCFF
RGB204, 204, 255
HSL240°, 100%, 90%
HSV240°, 20%, 100%
CMYK20%, 20%, 0%, 0%

Color Blindness Simulation

Protanopia
Red-blind. Cannot perceive red light.
Sees: #BFD2FF (~1.3% of males)
Deuteranopia
Green-blind. Cannot perceive green light.
Sees: #BECFFE (~1.2% of males)
Tritanopia
Blue-blind. Cannot perceive blue light.
Sees: #C1D5DD (~0.01% of population)
Achromatopsia
Total color blindness. Sees only grayscale.
Sees: #D2D2D2 (~0.003% of population)

Periwinkle as Text Color

Periwinkle on White
1.5:1FAIL
Periwinkle on Light Gray
1.4:1FAIL
Periwinkle on Cream
1.5:1FAIL
Periwinkle on Dark
11.1:1AAA
Periwinkle on Black
13.6:1AAA
Periwinkle on Soft Blue
1.3:1FAIL
Periwinkle on Soft Green
1.4:1FAIL
Periwinkle on Soft Pink
1.3:1FAIL

Nearest Tailwind Class

slate-300
#CBD5E1

Nearest Pantone Match

Pantone Cool Gray 1
#D9D9D6

CSS Variable Export

:root {
  --color-periwinkle: #CCCCFF;
  --color-periwinkle-rgb: 204, 204, 255;
}

Tailwind Config

// tailwind.config.js
colors: {
  'periwinkle': '#CCCCFF',
}

Shades of Periwinkle

#CCCCFF
#9999FF
#6666FF
#3333FF
#0000FF
#0000CC
#000099
#000066
#000033
#000000

Tints of Periwinkle

#CCCCFF
#D1D1FF
#D6D6FF
#DBDBFF
#E0E0FF
#EBEBFF
#F0F0FF
#F5F5FF
#FAFAFF
#FFFFFF

Color Harmonies

Complementary

#CCCCFF
#FFFFCC

Analogous

#CCE5FF
#CCCCFF
#E5CCFF

Triadic

#CCCCFF
#FFCCCC
#CCFFCC

Periwinkle Text Preview

Heading in Periwinkle

Body text in Periwinkle. The quick brown fox jumps over the lazy dog.

White on Periwinkle

Body text on a Periwinkle background.

Periwinkle text on dark background

Contrast: 11.5:1