Adlandırılmış renk · #F5DFBC
Ginger Ale Fizz
Ginger Ale Fizz, #F5DFBC: rgb(245 223 188), hsl(37 74% 85%), oklch(0.913 0.052 79.4). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Ginger Ale Fizz color name →
#F5DFBC
oklch(0.913 0.052 79.4)
Renk dönüşümleri
- HEX
- #f5dfbc
- RGB
- rgb(245 223 188)
- HSL
- hsl(37 74% 85%)
- HWB
- hwb(37 74% 4%)
- OKLCH
- oklch(0.913 0.052 79.4)
- OKLab
- oklab(0.913 0.01 0.051)
- CIE Lab
- lab(89.98 3.88 20.12)
- LCH
- lch(89.98 20.49 79.1)
- CMYK
- cmyk(0% 9% 23% 4%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F6E2C3
- F7E5C9
- F8E9D0
- F9ECD7
- FAEFDE
- FBF2E4
- FCF5EB
- FDF9F2
- FEFCF8
Koyu tonlar
- D5C2A3
- B6A58B
- 988A73
- 7B6F5D
- 5F5647
- 443D32
- 2B271F
- 15120D
- 030202
Gri tonlar
- E9D5B6
- DDCBB0
- D1C2AA
- C5B8A4
- B9AE9E
- ADA598
- A29C92
- 96928C
- 8B8986
Renk uyumları
Tamamlayıcı +180°
- F5DFBC
Ginger Ale Fizz
- D2E3FF
≈ Weathered Blue
Analog -30° +30°
- F5DFBC
Ginger Ale Fizz
- FFD9C5
≈ Friendship
- E4E6BE
≈ Lily Scent Green
Üçlü +120° +240°
- F5DFBC
Ginger Ale Fizz
- BBEDEF
≈ Cold Blooded
- F2D8F8
≈ Grape Taffy
Bölünmüş tamamlayıcı +150° +210°
- F5DFBC
Ginger Ale Fizz
- C0EAFE
≈ Blue Java Banana
- E1DEFF
≈ Contrail
Dörtlü +90° +180° +270°
- F5DFBC
Ginger Ale Fizz
- C1EEDC
≈ Fresh Breeze
- D2E3FF
≈ Weathered Blue
- FED5E7
≈ Pink Currant
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.29:1 · APCA Lc 15
Ag
AAASiyah üzerinde
WCAG 16.16:1 · APCA Lc 89
En iyi metin rengi: #000000
WCAG 16.16:1 (AAA) · APCA Lc 89
Contrast pairs
Kod parçacıkları
CSS
:root {
--ginger-ale-fizz: #f5dfbc;
--ginger-ale-fizz-rgb: 245 223 188;
--ginger-ale-fizz-oklch: oklch(0.913 0.052 79.4);
}
.element {
color: var(--ginger-ale-fizz);
background-color: hsl(37 74% 85%);
border-color: oklch(0.913 0.052 79.4);
}Tailwind CSS v4
@theme {
--color-ginger-ale-fizz: #f5dfbc;
--color-ginger-ale-fizz-50: #fdf4e5;
--color-ginger-ale-fizz-100: #f1e7d5;
--color-ginger-ale-fizz-200: #e0d3bc;
--color-ginger-ale-fizz-300: #c5b59a;
--color-ginger-ale-fizz-400: #af9b7c;
--color-ginger-ale-fizz-500: #99835f;
--color-ginger-ale-fizz-600: #816f51;
--color-ginger-ale-fizz-700: #675840;
--color-ginger-ale-fizz-800: #4d402e;
--color-ginger-ale-fizz-900: #352c1f;
--color-ginger-ale-fizz-950: #20190f;
}SCSS
$ginger-ale-fizz: #f5dfbc;
$ginger-ale-fizz-rgb: 245, 223, 188;
$ginger-ale-fizz-light: mix(#fff, $ginger-ale-fizz, 20%);
$ginger-ale-fizz-dark: mix(#000, $ginger-ale-fizz, 20%);
.element {
color: $ginger-ale-fizz;
box-shadow: 0 0 0 2px rgba($ginger-ale-fizz, 0.35);
}