Màu có tên · #F3EAD2
Vanilla Wafer
Vanilla Wafer là #F3EAD2: rgb(243 234 210), hsl(44 58% 89%), oklch(0.938 0.033 89.9). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Gray mean? → · Vanilla Wafer color name →
#F3EAD2
oklch(0.938 0.033 89.9)
Chuyển đổi màu
- HEX
- #f3ead2
- RGB
- rgb(243 234 210)
- HSL
- hsl(44 58% 89%)
- HWB
- hwb(44 82% 5%)
- OKLCH
- oklch(0.938 0.033 89.9)
- OKLab
- oklab(0.938 0 0.033)
- CIE Lab
- lab(92.94 0.23 12.85)
- LCH
- lch(92.94 12.85 89)
- CMYK
- cmyk(0% 4% 14% 5%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- F4ECD7
- F5EEDB
- F7F0E0
- F8F2E4
- F9F5E9
- FAF7ED
- FBF9F2
- FDFBF6
- FEFDFB
Sắc đậm
- D3CBB6
- B4AE9B
- 979181
- 7A7568
- 5E5A50
- 444139
- 2B2924
- 141310
- 030302
Sắc xám
- E7DFCA
- DBD4C1
- CFC9B9
- C3BEB0
- B8B4A8
- ACA9A0
- A19F98
- 969490
- 8B8A88
Hòa sắc
Bổ túc +180°
- F3EAD2
Vanilla Wafer
- E2EAFF
≈ Glitter
Tương đồng -30° +30°
- F3EAD2
Vanilla Wafer
- FCE6D5
≈ Winthrop Peach
- E7EED6
≈ Translucent Vision
Bộ ba +120° +240°
- F3EAD2
Vanilla Wafer
- D2F1F7
≈ Frostproof
- F8E3F5
≈ Soft Lavender
Bổ túc chia +150° +210°
- F3EAD2
Vanilla Wafer
- D7EEFF
≈ Ice Castle
- EDE6FE
≈ Cyber Lavender
Bộ bốn +90° +180° +270°
- F3EAD2
Vanilla Wafer
- D4F2EB
≈ Diminished Sky
- E2EAFF
≈ Glitter
- FFE2E9
≈ Baby Girl
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.19:1 · APCA Lc 10
Ag
AAATrên nền đen
WCAG 17.51:1 · APCA Lc 94
Màu chữ tốt nhất: #000000
WCAG 17.51:1 (AAA) · APCA Lc 94
Contrast pairs
Đoạn mã
CSS
:root {
--vanilla-wafer: #f3ead2;
--vanilla-wafer-rgb: 243 234 210;
--vanilla-wafer-oklch: oklch(0.938 0.033 89.9);
}
.element {
color: var(--vanilla-wafer);
background-color: hsl(44 58% 89%);
border-color: oklch(0.938 0.033 89.9);
}Tailwind CSS v4
@theme {
--color-vanilla-wafer: #f3ead2;
--color-vanilla-wafer-50: #f8f5eb;
--color-vanilla-wafer-100: #ece8dc;
--color-vanilla-wafer-200: #d9d4c5;
--color-vanilla-wafer-300: #bdb7a5;
--color-vanilla-wafer-400: #a69e89;
--color-vanilla-wafer-500: #8f866d;
--color-vanilla-wafer-600: #79715d;
--color-vanilla-wafer-700: #615a4a;
--color-vanilla-wafer-800: #474235;
--color-vanilla-wafer-900: #312d24;
--color-vanilla-wafer-950: #1d1a13;
}SCSS
$vanilla-wafer: #f3ead2;
$vanilla-wafer-rgb: 243, 234, 210;
$vanilla-wafer-light: mix(#fff, $vanilla-wafer, 20%);
$vanilla-wafer-dark: mix(#000, $vanilla-wafer, 20%);
.element {
color: $vanilla-wafer;
box-shadow: 0 0 0 2px rgba($vanilla-wafer, 0.35);
}