Adlandırılmış renk · #EFE1A7
French Vanilla
French Vanilla, #EFE1A7: rgb(239 225 167), hsl(48 69% 80%), oklch(0.907 0.076 96.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · French Vanilla color name →
#EFE1A7
oklch(0.907 0.076 96.2)
Renk dönüşümleri
- HEX
- #efe1a7
- RGB
- rgb(239 225 167)
- HSL
- hsl(48 69% 80%)
- HWB
- hwb(48 65% 6%)
- OKLCH
- oklch(0.907 0.076 96.2)
- OKLab
- oklab(0.907 -0.008 0.076)
- CIE Lab
- lab(89.64 -1.38 30.29)
- LCH
- lch(89.64 30.33 92.6)
- CMYK
- cmyk(0% 6% 30% 6%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F1E4B0
- F2E7B9
- F4EAC2
- F5EDCB
- F7F0D4
- F9F3DC
- FAF6E5
- FCF9EE
- FDFCF6
Koyu tonlar
- D0C491
- B1A77B
- 948B66
- 787052
- 5C563E
- 423E2C
- 2A271A
- 14120A
- 030201
Gri tonlar
- E3D7A3
- D8CDA0
- CCC39C
- C1B998
- B6AF94
- ABA690
- A09C8C
- 959388
- 8A8984
Renk uyumları
Tamamlayıcı +180°
- EFE1A7
French Vanilla
- D8DFFF
≈ Transparent Blue
Analog -30° +30°
- EFE1A7
French Vanilla
- FFD9B3
≈ Acini di Pepe
- D4EAB3
≈ Imbued With Mint
Üçlü +120° +240°
- EFE1A7
French Vanilla
- AAEDFF
≈ Beyond the Clouds
- FFD0F2
≈ Shampoo
Bölünmüş tamamlayıcı +150° +210°
- EFE1A7
French Vanilla
- C7E4FF
≈ Fresh Water
- EAD7FF
≈ Lavender Savour
Dörtlü +90° +180° +270°
- EFE1A7
French Vanilla
- A5F1E8
≈ Mint Tea
- D8DFFF
≈ Transparent Blue
- FFD3DB
≈ Pink Fluorite
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.31:1 · APCA Lc 15
Ag
AAASiyah üzerinde
WCAG 15.99:1 · APCA Lc 88
En iyi metin rengi: #000000
WCAG 15.99:1 (AAA) · APCA Lc 88
Contrast pairs
Kod parçacıkları
CSS
:root {
--french-vanilla: #efe1a7;
--french-vanilla-rgb: 239 225 167;
--french-vanilla-oklch: oklch(0.907 0.076 96.2);
}
.element {
color: var(--french-vanilla);
background-color: hsl(48 69% 80%);
border-color: oklch(0.907 0.076 96.2);
}Tailwind CSS v4
@theme {
--color-french-vanilla: #efe1a7;
--color-french-vanilla-50: #fbf6dd;
--color-french-vanilla-100: #eee9cc;
--color-french-vanilla-200: #dcd5b0;
--color-french-vanilla-300: #c1b88c;
--color-french-vanilla-400: #ab9f6a;
--color-french-vanilla-500: #958648;
--color-french-vanilla-600: #7e723e;
--color-french-vanilla-700: #655b31;
--color-french-vanilla-800: #4b4222;
--color-french-vanilla-900: #342e17;
--color-french-vanilla-950: #1f1a08;
}SCSS
$french-vanilla: #efe1a7;
$french-vanilla-rgb: 239, 225, 167;
$french-vanilla-light: mix(#fff, $french-vanilla, 20%);
$french-vanilla-dark: mix(#000, $french-vanilla, 20%);
.element {
color: $french-vanilla;
box-shadow: 0 0 0 2px rgba($french-vanilla, 0.35);
}