Color con nombre · #FEDCC3
Whispering Peach
Whispering Peach es #FEDCC3: rgb(254 220 195), hsl(25 97% 88%), oklch(0.916 0.05 58.4). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Orange mean? → · Whispering Peach color name →
#FEDCC3
oklch(0.916 0.05 58.4)
Conversiones de color
- HEX
- #fedcc3
- RGB
- rgb(254 220 195)
- HSL
- hsl(25 97% 88%)
- HWB
- hwb(25 76% 0%)
- OKLCH
- oklch(0.916 0.05 58.4)
- OKLab
- oklab(0.916 0.026 0.043)
- CIE Lab
- lab(90.17 9.42 16.91)
- LCH
- lch(90.17 19.36 60.9)
- CMYK
- cmyk(0% 13% 23% 0%)
Tintes · Sombras · Tonos
Tintes
- FEE0C9
- FEE3CF
- FFE7D5
- FFEADB
- FFEEE1
- FFF1E7
- FFF5ED
- FFF8F3
- FFFCF9
Sombras
- DDBFA9
- BDA390
- 9E8878
- 806E60
- 63544A
- 473C34
- 2D2620
- 16110E
- 030202
Tonos
- F1D2BC
- E4C9B5
- D7C0AF
- CAB6A8
- BDADA1
- B1A49A
- A49B94
- 98928D
- 8C8987
Armonías de color
Complementario +180°
- FEDCC3
Whispering Peach
- C8E9FF
≈ Blue Java Banana
Análogo -30° +30°
- FEDCC3
Whispering Peach
- FFD9D4
≈ Forgotten Pink
- F1E2BE
≈ Clover Honey
Triádico +120° +240°
- FEDCC3
Whispering Peach
- C0EFE4
≈ Light Water Wings
- E7DDFF
≈ Lavender Savour
Complementario dividido +150° +210°
- FEDCC3
Whispering Peach
- BDEDF5
≈ Icy Breeze
- D8E3FF
≈ Stoic White
Tetrádico +90° +180° +270°
- FEDCC3
Whispering Peach
- CEEDD1
≈ Celery Stick
- C8E9FF
≈ Blue Java Banana
- F7D8F5
≈ Jacaranda
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.29:1 · APCA Lc 15
Ag
AAASobre negro
WCAG 16.23:1 · APCA Lc 89
Mejor color de texto: #000000
WCAG 16.23:1 (AAA) · APCA Lc 89
Contrast pairs
Fragmentos de código
CSS
:root {
--whispering-peach: #fedcc3;
--whispering-peach-rgb: 254 220 195;
--whispering-peach-oklch: oklch(0.916 0.05 58.4);
}
.element {
color: var(--whispering-peach);
background-color: hsl(25 97% 88%);
border-color: oklch(0.916 0.05 58.4);
}Tailwind CSS v4
@theme {
--color-whispering-peach: #fedcc3;
--color-whispering-peach-50: #fff2e7;
--color-whispering-peach-100: #f5e4d7;
--color-whispering-peach-200: #e5d0bf;
--color-whispering-peach-300: #cbb29e;
--color-whispering-peach-400: #b69881;
--color-whispering-peach-500: #a07e65;
--color-whispering-peach-600: #876b56;
--color-whispering-peach-700: #6c5644;
--color-whispering-peach-800: #503e31;
--color-whispering-peach-900: #382b22;
--color-whispering-peach-950: #221811;
}SCSS
$whispering-peach: #fedcc3;
$whispering-peach-rgb: 254, 220, 195;
$whispering-peach-light: mix(#fff, $whispering-peach, 20%);
$whispering-peach-dark: mix(#000, $whispering-peach, 20%);
.element {
color: $whispering-peach;
box-shadow: 0 0 0 2px rgba($whispering-peach, 0.35);
}