Color con nombre · #E5DBEB
Princess Fairy Tale
Princess Fairy Tale es #E5DBEB: rgb(229 219 235), hsl(278 29% 89%), oklch(0.904 0.024 313.1). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Princess Fairy Tale color name →
#E5DBEB
oklch(0.904 0.024 313.1)
Conversiones de color
- HEX
- #e5dbeb
- RGB
- rgb(229 219 235)
- HSL
- hsl(278 29% 89%)
- HWB
- hwb(278 86% 8%)
- OKLCH
- oklch(0.904 0.024 313.1)
- OKLab
- oklab(0.904 0.016 -0.018)
- CIE Lab
- lab(88.57 5.67 -6.57)
- LCH
- lch(88.57 8.68 310.8)
- CMYK
- cmyk(3% 7% 0% 8%)
Tintes · Sombras · Tonos
Tintes
- E8DFED
- EAE2EF
- EDE6F1
- EFE9F3
- F2EDF5
- F5F1F7
- F7F4F9
- FAF8FB
- FCFBFD
Sombras
- C7BECC
- AAA2AE
- 8E8791
- 726D75
- 58545B
- 3F3C41
- 282629
- 121113
- 030203
Tonos
- DAD2E0
- D0C8D5
- C6BFCA
- BBB6BF
- B1ACB4
- A7A3A9
- 9D9A9F
- 939194
- 8A898A
Armonías de color
Complementario +180°
- E5DBEB
Princess Fairy Tale
- D9E3D3
≈ Lime Cake
Análogo -30° +30°
- E5DBEB
Princess Fairy Tale
- DDDEEF
≈ Artemis Silver
- ECD9E3
≈ Rosa Bonito
Triádico +120° +240°
- E5DBEB
Princess Fairy Tale
- E9DDCE
≈ Cinnamon Cake
- CEE5E4
≈ Zircon Ice
Complementario dividido +150° +210°
- E5DBEB
Princess Fairy Tale
- E2E0CE
≈ Emerging Leaf
- D2E5DB
≈ Summer Breeze
Tetrádico +90° +180° +270°
- E5DBEB
Princess Fairy Tale
- EEDBD3
≈ Blushing Bride
- D9E3D3
≈ Lime Cake
- CFE3EB
≈ Soft Cloud
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.34:1 · APCA Lc 17
Ag
AAASobre negro
WCAG 15.66:1 · APCA Lc 87
Mejor color de texto: #000000
WCAG 15.66:1 (AAA) · APCA Lc 87
Contrast pairs
Fragmentos de código
CSS
:root {
--princess-fairy-tale: #e5dbeb;
--princess-fairy-tale-rgb: 229 219 235;
--princess-fairy-tale-oklch: oklch(0.904 0.024 313.1);
}
.element {
color: var(--princess-fairy-tale);
background-color: hsl(278 29% 89%);
border-color: oklch(0.904 0.024 313.1);
}Tailwind CSS v4
@theme {
--color-princess-fairy-tale: #e5dbeb;
--color-princess-fairy-tale-50: #f8f3fa;
--color-princess-fairy-tale-100: #ebe6ed;
--color-princess-fairy-tale-200: #d8d1db;
--color-princess-fairy-tale-300: #bcb4c0;
--color-princess-fairy-tale-400: #a39ba9;
--color-princess-fairy-tale-500: #8c8292;
--color-princess-fairy-tale-600: #766e7b;
--color-princess-fairy-tale-700: #5f5863;
--color-princess-fairy-tale-800: #454049;
--color-princess-fairy-tale-900: #302c32;
--color-princess-fairy-tale-950: #1c191e;
}SCSS
$princess-fairy-tale: #e5dbeb;
$princess-fairy-tale-rgb: 229, 219, 235;
$princess-fairy-tale-light: mix(#fff, $princess-fairy-tale, 20%);
$princess-fairy-tale-dark: mix(#000, $princess-fairy-tale, 20%);
.element {
color: $princess-fairy-tale;
box-shadow: 0 0 0 2px rgba($princess-fairy-tale, 0.35);
}