Cor nomeada · #DEA5A4
Pastel Pink
Pastel Pink é #DEA5A4: rgb(222 165 164), hsl(1 47% 76%), oklch(0.775 0.068 19.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Pastel Pink color name →
#DEA5A4
oklch(0.775 0.068 19.9)
Conversões de cor
- HEX
- #dea5a4
- RGB
- rgb(222 165 164)
- HSL
- hsl(1 47% 76%)
- HWB
- hwb(1 64% 13%)
- OKLCH
- oklch(0.775 0.068 19.9)
- OKLab
- oklab(0.775 0.064 0.023)
- CIE Lab
- lab(73.2 21.57 9.21)
- LCH
- lch(73.2 23.46 23.1)
- CMYK
- cmyk(0% 26% 26% 13%)
Tons claros · Sombras · Tons
Tons claros
- E2AEAD
- E5B7B6
- E9C0BF
- ECC9C8
- F0D2D1
- F3DBDA
- F6E4E3
- F9EDEC
- FCF6F6
Sombras
- C18F8E
- A57979
- 896564
- 6F5150
- 553D3D
- 3D2B2B
- 261A1A
- 120A0A
- 020101
Tons
- D4A1A0
- CB9E9D
- C29A99
- B89695
- AF9392
- A58F8E
- 9C8B8B
- 938887
- 898484
Harmonias de cor
Complementar +180°
- DEA5A4
Pastel Pink
- 81C3C7
≈ Big Sky Country
Análoga -30° +30°
- DEA5A4
Pastel Pink
- D8A5BC
≈ Rhubarb Gin
- DAAA8F
≈ Salmon Sand
Tríade +120° +240°
- DEA5A4
Pastel Pink
- 9FC198
≈ Spruce Stone
- 9DB7E2
≈ Honest
Complementar dividida +150° +210°
- DEA5A4
Pastel Pink
- 8AC4AF
≈ Hellion Green
- 89BFD9
≈ High Elf Blue
Tétrade +90° +180° +270°
- DEA5A4
Pastel Pink
- B8BA88
≈ Aloe Plant
- 81C3C7
≈ Big Sky Country
- B4AFDF
≈ Purple Hibiscus
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.09:1 · APCA Lc 41
Ag
AAASobre preto
WCAG 10.02:1 · APCA Lc 61
Melhor cor de texto: #000000
WCAG 10.02:1 (AAA) · APCA Lc 61
Contrast pairs
Trechos de código
CSS
:root {
--pastel-pink: #dea5a4;
--pastel-pink-rgb: 222 165 164;
--pastel-pink-oklch: oklch(0.775 0.068 19.9);
}
.element {
color: var(--pastel-pink);
background-color: hsl(1 47% 76%);
border-color: oklch(0.775 0.068 19.9);
}Tailwind CSS v4
@theme {
--color-pastel-pink: #dea5a4;
--color-pastel-pink-50: #ffeeec;
--color-pastel-pink-100: #fee0de;
--color-pastel-pink-200: #f0cac7;
--color-pastel-pink-300: #d8aaa8;
--color-pastel-pink-400: #c38f8e;
--color-pastel-pink-500: #af7474;
--color-pastel-pink-600: #946262;
--color-pastel-pink-700: #764f4e;
--color-pastel-pink-800: #583939;
--color-pastel-pink-900: #3d2727;
--color-pastel-pink-950: #271516;
}SCSS
$pastel-pink: #dea5a4;
$pastel-pink-rgb: 222, 165, 164;
$pastel-pink-light: mix(#fff, $pastel-pink, 20%);
$pastel-pink-dark: mix(#000, $pastel-pink, 20%);
.element {
color: $pastel-pink;
box-shadow: 0 0 0 2px rgba($pastel-pink, 0.35);
}