Petrichor Complementary Color Scheme

Five colors arranged by the complementary rule around Petrichor (#66CCCC), each snapped to its nearest named color.

#66CCCC

#AFE4E2

#CC6666

#AC3B3B

#E5B3B2

Color names and codes

Name	HEX	RGB	HSL	CMYK
Petrichor	`#66CCCC`	102, 204, 204	180°, 50%, 60%	50, 0, 0, 20
Timeless Seafoam	`#AFE4E2`	175, 228, 226	178°, 50%, 79%	23, 0, 1, 11
Fuzzy Wuzzy	`#CC6666`	204, 102, 102	0°, 50%, 60%	0, 50, 50, 20
Indiscreet	`#AC3B3B`	172, 59, 59	0°, 49%, 45%	0, 66, 66, 33
Perfect Pink	`#E5B3B2`	229, 179, 178	1°, 50%, 80%	0, 22, 22, 10

Which pairs work for text

Text on background	Contrast	WCAG
Aa #AFE4E2 on #AC3B3B	4.36:1	AA large
Aa #AC3B3B on #E5B3B2	3.32:1	AA large
Aa #66CCCC on #AC3B3B	3.22:1	AA large
Aa #AFE4E2 on #CC6666	2.65:1	—
Aa #CC6666 on #E5B3B2	2.02:1	—
Aa #66CCCC on #CC6666	1.96:1	—

CSS variables

:root {
  --color-1: #66cccc; /* Petrichor */
  --color-2: #afe4e2; /* Timeless Seafoam */
  --color-3: #cc6666; /* Fuzzy Wuzzy */
  --color-4: #ac3b3b; /* Indiscreet */
  --color-5: #e5b3b2; /* Perfect Pink */
}

Other schemes from Petrichor

More Light Teal complementary palettes

Questions

What colors go with Petrichor?

In a complementary scheme: Timeless Seafoam (#AFE4E2), Fuzzy Wuzzy (#CC6666), Indiscreet (#AC3B3B), Perfect Pink (#E5B3B2).

What is the hex code of Petrichor?

#66CCCC.