Named color · #E7CAC3
Tangy Taffy
Tangy Taffy is #E7CAC3: rgb(231 202 195), hsl(12 43% 84%), oklch(0.861 0.034 33.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Tangy Taffy color name →
#E7CAC3
oklch(0.861 0.034 33.8)
Color conversions
- HEX
- #e7cac3
- RGB
- rgb(231 202 195)
- HSL
- hsl(12 43% 84%)
- HWB
- hwb(12 76% 9%)
- OKLCH
- oklch(0.861 0.034 33.8)
- OKLab
- oklab(0.861 0.028 0.019)
- CIE Lab
- lab(83.67 9.7 7.45)
- LCH
- lch(83.67 12.23 37.5)
- CMYK
- cmyk(0% 13% 16% 9%)
Tints · Shades · Tones
Tints
- EACFC9
- ECD4CF
- EEDAD5
- F1DFDB
- F3E4E1
- F6EAE7
- F8EFED
- FAF4F3
- FDFAF9
Shades
- C9AFA9
- AB9590
- 8F7C78
- 736460
- 594D4A
- 403734
- 282220
- 130F0E
- 030202
Tones
- DCC2BC
- D2BBB5
- C7B3AE
- BDACA8
- B2A4A1
- A89D9A
- 9E9694
- 948E8D
- 8A8786
Color harmonies
Complementary +180°
- E7CAC3
Tangy Taffy
- B9D8DF
≈ Everglade Mist
Analogous -30° +30°
- E7CAC3
Tangy Taffy
- E6C9CF
≈ Perfume Cloud
- E2CDBB
≈ Safari Map
Triadic +120° +240°
- E7CAC3
Tangy Taffy
- C1D8C7
≈ Edgewater
- CAD0E9
≈ Arctic Glow
Split-complementary +150° +210°
- E7CAC3
Tangy Taffy
- BAD9D4
≈ High Point
- BFD5E7
≈ Light Tidal Foam
Tetradic +90° +180° +270°
- E7CAC3
Tangy Taffy
- CDD6BD
≈ Canary Green
- B9D8DF
≈ Everglade Mist
- D6CCE4
≈ Potentially Purple
Contrast & accessibility
Ag
FailOn white
WCAG 1.54:1 · APCA Lc 25
Ag
AAAOn black
WCAG 13.63:1 · APCA Lc 78
Best text color: #000000
WCAG 13.63:1 (AAA) · APCA Lc 78
Contrast pairs
Code snippets
CSS
:root {
--tangy-taffy: #e7cac3;
--tangy-taffy-rgb: 231 202 195;
--tangy-taffy-oklch: oklch(0.861 0.034 33.8);
}
.element {
color: var(--tangy-taffy);
background-color: hsl(12 43% 84%);
border-color: oklch(0.861 0.034 33.8);
}Tailwind CSS v4
@theme {
--color-tangy-taffy: #e7cac3;
--color-tangy-taffy-50: #fff2ee;
--color-tangy-taffy-100: #f3e4e0;
--color-tangy-taffy-200: #e2cfca;
--color-tangy-taffy-300: #c8b2ac;
--color-tangy-taffy-400: #b29891;
--color-tangy-taffy-500: #9c7e77;
--color-tangy-taffy-600: #836b65;
--color-tangy-taffy-700: #695651;
--color-tangy-taffy-800: #4e3e3b;
--color-tangy-taffy-900: #362b28;
--color-tangy-taffy-950: #211816;
}SCSS
$tangy-taffy: #e7cac3;
$tangy-taffy-rgb: 231, 202, 195;
$tangy-taffy-light: mix(#fff, $tangy-taffy, 20%);
$tangy-taffy-dark: mix(#000, $tangy-taffy, 20%);
.element {
color: $tangy-taffy;
box-shadow: 0 0 0 2px rgba($tangy-taffy, 0.35);
}