Couleur nommée la plus proche · #CFA8B6
#CFA8B6
Couleur nommée la plus proche: Strawberry Latte
#CFA8B6 (rgb(207 168 182), hsl(338 29% 74%), oklch(0.771 0.049 354.8)) est la plus proche de la couleur nommée Strawberry Latte. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#CFA8B6
oklch(0.771 0.049 354.8)
Conversions de couleur
- HEX
- #cfa8b6
- RGB
- rgb(207 168 182)
- HSL
- hsl(338 29% 74%)
- HWB
- hwb(338 66% 19%)
- OKLCH
- oklch(0.771 0.049 354.8)
- OKLab
- oklab(0.771 0.049 -0.004)
- CIE Lab
- lab(72.75 16.39 -1.53)
- LCH
- lch(72.75 16.46 354.7)
- CMYK
- cmyk(0% 19% 12% 19%)
Teintes · Ombres · Tons
Teintes
- D4B0BD
- D9B9C4
- DEC2CB
- E3CAD3
- E7D3DA
- ECDCE1
- F1E4E9
- F6EDF0
- FAF6F7
Ombres
- B4929E
- 997C86
- 7F676F
- 675259
- 4F3F44
- 382C30
- 231A1D
- 100A0C
- 020102
Tons
- C7A4B0
- BFA0AB
- B79CA5
- AF98A0
- A7949B
- 9F9095
- 978C90
- 90888B
- 888485
Harmonies de couleurs
Complémentaire +180°
- CFA8B6
Strawberry Latte
- 94BFB2
≈ Scenic View
Analogue -30° +30°
- CFA8B6
Strawberry Latte
- C5AAC6
≈ Linnea Blossom
- D2A9A5
≈ Baby Jane
Triadique +120° +240°
- CFA8B6
Strawberry Latte
- B3B995
≈ Chrysoprase
- 97BAD0
≈ Northern Sky Blue
Complémentaire divisée +150° +210°
- CFA8B6
Strawberry Latte
- A2BDA1
≈ Spring Rain
- 90BEC3
≈ Kingston Aqua
Tétradique +90° +180° +270°
- CFA8B6
Strawberry Latte
- C3B391
≈ Trailblazer
- 94BFB2
≈ Scenic View
- A5B5D5
≈ Awesome Violet
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.11:1 · APCA Lc 41
Ag
AAASur noir
WCAG 9.92:1 · APCA Lc 61
Meilleure couleur de texte: #000000
WCAG 9.92:1 (AAA) · APCA Lc 61
Contrast pairs
Extraits de code
CSS
:root {
--strawberry-latte: #cfa8b6;
--strawberry-latte-rgb: 207 168 182;
--strawberry-latte-oklch: oklch(0.771 0.049 354.8);
}
.element {
color: var(--strawberry-latte);
background-color: hsl(338 29% 74%);
border-color: oklch(0.771 0.049 354.8);
}Tailwind CSS v4
@theme {
--color-strawberry-latte: #cfa8b6;
--color-strawberry-latte-50: #fff0f5;
--color-strawberry-latte-100: #f7e1e8;
--color-strawberry-latte-200: #e7ccd4;
--color-strawberry-latte-300: #cdadb8;
--color-strawberry-latte-400: #b793a0;
--color-strawberry-latte-500: #a17988;
--color-strawberry-latte-600: #886773;
--color-strawberry-latte-700: #6d525c;
--color-strawberry-latte-800: #503b44;
--color-strawberry-latte-900: #38292f;
--color-strawberry-latte-950: #22171b;
}SCSS
$strawberry-latte: #cfa8b6;
$strawberry-latte-rgb: 207, 168, 182;
$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);
}