Cor nomeada · #FFFFEB
Vanilla Drop
Vanilla Drop é #FFFFEB: rgb(255 255 235), hsl(60 100% 96%), oklch(0.995 0.026 106.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Vanilla Drop color name →
#FFFFEB
oklch(0.995 0.026 106.9)
Conversões de cor
- HEX
- #ffffeb
- RGB
- rgb(255 255 235)
- HSL
- hsl(60 100% 96%)
- HWB
- hwb(60 92% 0%)
- OKLCH
- oklch(0.995 0.026 106.9)
- OKLab
- oklab(0.995 -0.008 0.025)
- CIE Lab
- lab(99.6 -2.5 9.6)
- LCH
- lch(99.6 9.92 104.6)
- CMYK
- cmyk(0% 0% 8% 0%)
Tons claros · Sombras · Tons
Tons claros
- FFFFED
- FFFFEF
- FFFFF1
- FFFFF3
- FFFFF5
- FFFFF7
- FFFFF9
- FFFFFB
- FFFFFD
Sombras
- DEDECC
- BEBEAE
- 9E9E91
- 808075
- 63635B
- 484841
- 2E2E29
- 161613
- 030303
Tons
- F2F2E0
- E4E4D5
- D7D7CA
- CACABF
- BDBEB4
- B1B1A9
- A4A49F
- 989894
- 8C8C8A
Harmonias de cor
Complementar +180°
- FFFFEB
Vanilla Drop
- FDFDFF
≈ Pale Grey
Análoga -30° +30°
- FFFFEB
Vanilla Drop
- FFFDFA
≈ Lotion
- FAFFF9
≈ Ceramic
Tríade +120° +240°
- FFFFEB
Vanilla Drop
- FBFEFF
≈ Polar Bear in a Blizzard
- FFFCFE
≈ Flawed White
Complementar dividida +150° +210°
- FFFFEB
Vanilla Drop
- FCFDFF
≈ Pale Grey
- FEFDFF
≈ Pale Grey
Tétrade +90° +180° +270°
- FFFFEB
Vanilla Drop
- F8FFFF
≈ Polar Bear in a Blizzard
- FDFDFF
≈ Pale Grey
- FFFDFD
≈ Whitecap Snow
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.01:1 · APCA Lc 0
Ag
AAASobre preto
WCAG 20.75:1 · APCA Lc 107
Melhor cor de texto: #000000
WCAG 20.75:1 (AAA) · APCA Lc 107
Contrast pairs
Trechos de código
CSS
:root {
--vanilla-drop: #ffffeb;
--vanilla-drop-rgb: 255 255 235;
--vanilla-drop-oklch: oklch(0.995 0.026 106.9);
}
.element {
color: var(--vanilla-drop);
background-color: hsl(60 100% 96%);
border-color: oklch(0.995 0.026 106.9);
}Tailwind CSS v4
@theme {
--color-vanilla-drop: #ffffeb;
--color-vanilla-drop-50: #f5f6ed;
--color-vanilla-drop-100: #e8e9df;
--color-vanilla-drop-200: #d5d5c9;
--color-vanilla-drop-300: #b8b9aa;
--color-vanilla-drop-400: #a0a08e;
--color-vanilla-drop-500: #888874;
--color-vanilla-drop-600: #737362;
--color-vanilla-drop-700: #5c5c4e;
--color-vanilla-drop-800: #434339;
--color-vanilla-drop-900: #2f2e27;
--color-vanilla-drop-950: #1b1b15;
}SCSS
$vanilla-drop: #ffffeb;
$vanilla-drop-rgb: 255, 255, 235;
$vanilla-drop-light: mix(#fff, $vanilla-drop, 20%);
$vanilla-drop-dark: mix(#000, $vanilla-drop, 20%);
.element {
color: $vanilla-drop;
box-shadow: 0 0 0 2px rgba($vanilla-drop, 0.35);
}