Color con nombre · #F4D4D6
Light Rose
Light Rose es #F4D4D6: rgb(244 212 214), hsl(356 59% 89%), oklch(0.897 0.036 13.6). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Pink mean? → · Light Rose color name →
#F4D4D6
oklch(0.897 0.036 13.6)
Conversiones de color
- HEX
- #f4d4d6
- RGB
- rgb(244 212 214)
- HSL
- hsl(356 59% 89%)
- HWB
- hwb(356 83% 4%)
- OKLCH
- oklch(0.897 0.036 13.6)
- OKLab
- oklab(0.897 0.035 0.008)
- CIE Lab
- lab(87.68 11.75 3.34)
- LCH
- lch(87.68 12.22 15.9)
- CMYK
- cmyk(0% 13% 12% 4%)
Tintes · Sombras · Tonos
Tintes
- F5D8DA
- F6DDDE
- F8E1E2
- F9E5E6
- FAE9EA
- FBEEEE
- FCF2F3
- FDF6F7
- FEFBFB
Sombras
- D4B8BA
- B59D9E
- 978384
- 7A696A
- 5E5152
- 443A3B
- 2B2425
- 141010
- 030202
Tonos
- E8CBCD
- DCC3C4
- D0BABB
- C4B2B3
- B9A9AA
- ADA1A1
- A29899
- 969091
- 8B8888
Armonías de color
Complementario +180°
- F4D4D6
Light Rose
- C3E5E4
≈ Swimming
Análogo -30° +30°
- F4D4D6
Light Rose
- EFD4E3
≈ Hopeful
- F3D6CA
≈ Chinese Cherry
Triádico +120° +240°
- F4D4D6
Light Rose
- D4E3CB
≈ Lime Flip
- CDDFF5
≈ Light Breeze
Complementario dividido +150° +210°
- F4D4D6
Light Rose
- C9E5D7
≈ Mint Whisper
- C5E3EF
≈ Skylark
Tetrádico +90° +180° +270°
- F4D4D6
Light Rose
- E1DFC4
≈ Bamboo
- C3E5E4
≈ Swimming
- D9DBF5
≈ Nostalgia Perfume
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.37:1 · APCA Lc 18
Ag
AAASobre negro
WCAG 15.23:1 · APCA Lc 85
Mejor color de texto: #000000
WCAG 15.23:1 (AAA) · APCA Lc 85
Contrast pairs
Fragmentos de código
CSS
:root {
--light-rose: #f4d4d6;
--light-rose-rgb: 244 212 214;
--light-rose-oklch: oklch(0.897 0.036 13.6);
}
.element {
color: var(--light-rose);
background-color: hsl(356 59% 89%);
border-color: oklch(0.897 0.036 13.6);
}Tailwind CSS v4
@theme {
--color-light-rose: #f4d4d6;
--color-light-rose-50: #fff1f2;
--color-light-rose-100: #f4e3e4;
--color-light-rose-200: #e3cecf;
--color-light-rose-300: #c9b0b1;
--color-light-rose-400: #b39698;
--color-light-rose-500: #9d7d7f;
--color-light-rose-600: #846a6c;
--color-light-rose-700: #6a5456;
--color-light-rose-800: #4e3d3f;
--color-light-rose-900: #362a2b;
--color-light-rose-950: #211819;
}SCSS
$light-rose: #f4d4d6;
$light-rose-rgb: 244, 212, 214;
$light-rose-light: mix(#fff, $light-rose, 20%);
$light-rose-dark: mix(#000, $light-rose, 20%);
.element {
color: $light-rose;
box-shadow: 0 0 0 2px rgba($light-rose, 0.35);
}