Nearest named color · #CAAAB7
#CAAAB7
Nearest named color: Strawberry Latte
#CAAAB7 (rgb(202 170 183), hsl(336 23% 73%), oklch(0.77 0.041 351.7)) is closest to the named color Strawberry Latte. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#CAAAB7
oklch(0.77 0.041 351.7)
Color conversions
- HEX
- #caaab7
- RGB
- rgb(202 170 183)
- HSL
- hsl(336 23% 73%)
- HWB
- hwb(336 67% 21%)
- OKLCH
- oklch(0.77 0.041 351.7)
- OKLab
- oklab(0.77 0.041 -0.006)
- CIE Lab
- lab(72.78 13.63 -2.11)
- LCH
- lch(72.78 13.79 351.2)
- CMYK
- cmyk(0% 16% 9% 21%)
Tints · Shades · Tones
Tints
- CFB2BE
- D5BBC5
- DAC3CC
- DFCBD3
- E5D4DA
- EADCE2
- EFE5E9
- F5EEF0
- FAF6F8
Shades
- AF939F
- 957D87
- 7C6870
- 64535A
- 4D3F45
- 372D31
- 221B1E
- 0F0B0C
- 020102
Tones
- C2A6B1
- BBA1AC
- B39DA6
- AC99A1
- A5959B
- 9D9196
- 968C90
- 8F888B
- 878485
Color harmonies
Complementary +180°
- CAAAB7
Strawberry Latte
- 9BBDB1
≈ Coveted Blue
Analogous -30° +30°
- CAAAB7
Strawberry Latte
- C1ACC4
≈ Monet Magic
- CDAAA9
≈ Vista
Triadic +120° +240°
- CAAAB7
Strawberry Latte
- B4B79A
≈ Disguise
- 9BBACA
≈ Arctic Sunrise
Split-complementary +150° +210°
- CAAAB7
Strawberry Latte
- A6BBA3
≈ Bryophyte
- 96BDBF
≈ Turner’s Light
Tetradic +90° +180° +270°
- CAAAB7
Strawberry Latte
- C2B297
≈ Beachside Villa
- 9BBDB1
≈ Coveted Blue
- A6B5CF
≈ Minuet
Contrast & accessibility
Ag
FailOn white
WCAG 2.11:1 · APCA Lc 41
Ag
AAAOn black
WCAG 9.94:1 · APCA Lc 61
Best text color: #000000
WCAG 9.94:1 (AAA) · APCA Lc 61
Contrast pairs
Code snippets
CSS
:root {
--strawberry-latte: #caaab7;
--strawberry-latte-rgb: 202 170 183;
--strawberry-latte-oklch: oklch(0.77 0.041 351.7);
}
.element {
color: var(--strawberry-latte);
background-color: hsl(336 23% 73%);
border-color: oklch(0.77 0.041 351.7);
}Tailwind CSS v4
@theme {
--color-strawberry-latte: #caaab7;
--color-strawberry-latte-50: #fff1f6;
--color-strawberry-latte-100: #f4e3e9;
--color-strawberry-latte-200: #e3cdd5;
--color-strawberry-latte-300: #c9afb9;
--color-strawberry-latte-400: #b395a1;
--color-strawberry-latte-500: #9c7b89;
--color-strawberry-latte-600: #846874;
--color-strawberry-latte-700: #6a535d;
--color-strawberry-latte-800: #4e3d44;
--color-strawberry-latte-900: #362a2f;
--color-strawberry-latte-950: #21171c;
}SCSS
$strawberry-latte: #caaab7;
$strawberry-latte-rgb: 202, 170, 183;
$strawberry-latte-light: mix(#fff, $strawberry-latte, 20%);
$strawberry-latte-dark: mix(#000, $strawberry-latte, 20%);
.element {
color: $strawberry-latte;
box-shadow: 0 0 0 2px rgba($strawberry-latte, 0.35);
}