Couleur nommée · #FDE9C5
Vanilla Frost
Vanilla Frost correspond à #FDE9C5 : rgb(253 233 197), hsl(39 93% 88%), oklch(0.941 0.052 82.3). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Orange mean? → · Vanilla Frost color name →
#FDE9C5
oklch(0.941 0.052 82.3)
Conversions de couleur
- HEX
- #fde9c5
- RGB
- rgb(253 233 197)
- HSL
- hsl(39 93% 88%)
- HWB
- hwb(39 77% 1%)
- OKLCH
- oklch(0.941 0.052 82.3)
- OKLab
- oklab(0.941 0.007 0.051)
- CIE Lab
- lab(93.3 2.97 20.17)
- LCH
- lch(93.3 20.39 81.6)
- CMYK
- cmyk(0% 8% 22% 1%)
Teintes · Ombres · Tons
Teintes
- FDEBCB
- FDEDD1
- FEF0D7
- FEF2DC
- FEF4E2
- FEF6E8
- FEF8EE
- FFFBF4
- FFFDF9
Ombres
- DCCBAB
- BCAD92
- 9D9079
- 7F7461
- 625A4B
- 474135
- 2D2921
- 16130E
- 030302
Tons
- F0DEBE
- E3D3B7
- D6C8B0
- C9BEA9
- BDB3A2
- B0A99B
- A49E94
- 98948E
- 8C8A87
Harmonies de couleurs
Complémentaire +180°
- FDE9C5
Vanilla Frost
- E2ECFF
≈ Husky
Analogue -30° +30°
- FDE9C5
Vanilla Frost
- FFE6D7
≈ Light Peach Rose
- ECF0C8
≈ Oh Dahling
Triadique +120° +240°
- FDE9C5
Vanilla Frost
- C4F7FB
≈ Pale Sky
- FCE1FF
≈ Sugarpills
Complémentaire divisée +150° +210°
- FDE9C5
Vanilla Frost
- D6F0FF
≈ Ice Castle
- EBE8FF
≈ Glitter
Tétradique +90° +180° +270°
- FDE9C5
Vanilla Frost
- C9F7E8
≈ Shallow End
- E2ECFF
≈ Husky
- FFE3EE
≈ Sweetly
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.19:1 · APCA Lc 9
Ag
AAASur noir
WCAG 17.63:1 · APCA Lc 95
Meilleure couleur de texte: #000000
WCAG 17.63:1 (AAA) · APCA Lc 95
Contrast pairs
Extraits de code
CSS
:root {
--vanilla-frost: #fde9c5;
--vanilla-frost-rgb: 253 233 197;
--vanilla-frost-oklch: oklch(0.941 0.052 82.3);
}
.element {
color: var(--vanilla-frost);
background-color: hsl(39 93% 88%);
border-color: oklch(0.941 0.052 82.3);
}Tailwind CSS v4
@theme {
--color-vanilla-frost: #fde9c5;
--color-vanilla-frost-50: #fcf4e5;
--color-vanilla-frost-100: #f0e7d5;
--color-vanilla-frost-200: #dfd3bc;
--color-vanilla-frost-300: #c4b69a;
--color-vanilla-frost-400: #ae9c7c;
--color-vanilla-frost-500: #97835f;
--color-vanilla-frost-600: #806f50;
--color-vanilla-frost-700: #665940;
--color-vanilla-frost-800: #4c412e;
--color-vanilla-frost-900: #352d1f;
--color-vanilla-frost-950: #201a0f;
}SCSS
$vanilla-frost: #fde9c5;
$vanilla-frost-rgb: 253, 233, 197;
$vanilla-frost-light: mix(#fff, $vanilla-frost, 20%);
$vanilla-frost-dark: mix(#000, $vanilla-frost, 20%);
.element {
color: $vanilla-frost;
box-shadow: 0 0 0 2px rgba($vanilla-frost, 0.35);
}