Couleur nommée · #E7C2CA
Primrose Pink
Primrose Pink correspond à #E7C2CA : rgb(231 194 202), hsl(347 44% 83%), oklch(0.848 0.043 3.5). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Pink mean? → · Primrose Pink color name →
#E7C2CA
oklch(0.848 0.043 3.5)
Conversions de couleur
- HEX
- #e7c2ca
- RGB
- rgb(231 194 202)
- HSL
- hsl(347 44% 83%)
- HWB
- hwb(347 76% 9%)
- OKLCH
- oklch(0.848 0.043 3.5)
- OKLab
- oklab(0.848 0.043 0.003)
- CIE Lab
- lab(81.86 14.51 1.15)
- LCH
- lch(81.86 14.56 4.5)
- CMYK
- cmyk(0% 16% 13% 9%)
Teintes · Ombres · Tons
Teintes
- EAC8CF
- ECCED4
- EFD4DA
- F1DADF
- F3E0E4
- F6E6EA
- F8EDEF
- FBF3F4
- FDF9FA
Ombres
- C9A8AF
- AB8F95
- 8F777C
- 736064
- 59494D
- 403437
- 282022
- 130E0F
- 030202
Tons
- DCBBC2
- D2B4BB
- C7AEB3
- BDA7AC
- B2A0A4
- A89A9D
- 9E9396
- 948D8E
- 8A8687
Harmonies de couleurs
Complémentaire +180°
- E7C2CA
Primrose Pink
- AFD7D0
≈ Scandal
Analogue -30° +30°
- E7C2CA
Primrose Pink
- DFC3D9
≈ Plum Taffy
- E8C4BB
≈ Congo
Triadique +120° +240°
- E7C2CA
Primrose Pink
- C7D2B4
≈ Bonsai Tint
- B6D1E8
≈ Modern Blue
Complémentaire divisée +150° +210°
- E7C2CA
Primrose Pink
- B8D6C0
≈ Reclining Green
- AED5DE
≈ Light Sea Spray
Tétradique +90° +180° +270°
- E7C2CA
Primrose Pink
- D6CDAE
≈ Dance With the Wind
- AFD7D0
≈ Scandal
- C4CCEA
≈ Ace
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.61:1 · APCA Lc 28
Ag
AAASur noir
WCAG 12.96:1 · APCA Lc 75
Meilleure couleur de texte: #000000
WCAG 12.96:1 (AAA) · APCA Lc 75
Contrast pairs
Extraits de code
CSS
:root {
--primrose-pink: #e7c2ca;
--primrose-pink-rgb: 231 194 202;
--primrose-pink-oklch: oklch(0.848 0.043 3.5);
}
.element {
color: var(--primrose-pink);
background-color: hsl(347 44% 83%);
border-color: oklch(0.848 0.043 3.5);
}Tailwind CSS v4
@theme {
--color-primrose-pink: #e7c2ca;
--color-primrose-pink-50: #fff0f3;
--color-primrose-pink-100: #f6e2e6;
--color-primrose-pink-200: #e6cdd1;
--color-primrose-pink-300: #ccafb4;
--color-primrose-pink-400: #b6949c;
--color-primrose-pink-500: #a07b83;
--color-primrose-pink-600: #87686f;
--color-primrose-pink-700: #6c5359;
--color-primrose-pink-800: #503c41;
--color-primrose-pink-900: #37292d;
--color-primrose-pink-950: #22171a;
}SCSS
$primrose-pink: #e7c2ca;
$primrose-pink-rgb: 231, 194, 202;
$primrose-pink-light: mix(#fff, $primrose-pink, 20%);
$primrose-pink-dark: mix(#000, $primrose-pink, 20%);
.element {
color: $primrose-pink;
box-shadow: 0 0 0 2px rgba($primrose-pink, 0.35);
}