Adlandırılmış renk · #FFF3A1
Firefly Glow
Firefly Glow, #FFF3A1: rgb(255 243 161), hsl(52 100% 82%), oklch(0.955 0.103 100.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Firefly Glow color name →
#FFF3A1
oklch(0.955 0.103 100.9)
Renk dönüşümleri
- HEX
- #fff3a1
- RGB
- rgb(255 243 161)
- HSL
- hsl(52 100% 82%)
- HWB
- hwb(52 63% 0%)
- OKLCH
- oklch(0.955 0.103 100.9)
- OKLab
- oklab(0.955 -0.02 0.101)
- CIE Lab
- lab(95.44 -4.29 41.09)
- LCH
- lch(95.44 41.31 96)
- CMYK
- cmyk(0% 5% 37% 0%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- FFF4AB
- FFF6B5
- FFF7BF
- FFF8C9
- FFF9D2
- FFFBDB
- FFFCE4
- FFFDED
- FFFEF6
Koyu tonlar
- DED38B
- BEB476
- 9E9762
- 807A4E
- 635E3C
- 48442A
- 2E2B19
- 161409
- 030301
Gri tonlar
- F2E79E
- E4DB9C
- D7CF99
- CAC496
- BDB893
- B1AD8F
- A4A18C
- 989688
- 8C8B84
Renk uyumları
Tamamlayıcı +180°
- FFF3A1
Firefly Glow
- EDEFFF
≈ Carte Blanche
Analog -30° +30°
- FFF3A1
Firefly Glow
- FFEDD9
≈ Sand Crystal
- D9FFB7
≈ Greedy Green
Üçlü +120° +240°
- FFF3A1
Firefly Glow
- DBF6FF
≈ Glacial Day
- FFE9F6
≈ Dolomite Crystal
Bölünmüş tamamlayıcı +150° +210°
- FFF3A1
Firefly Glow
- E6F2FF
≈ Cotton Boll
- F7EBFF
≈ Placebo Fuchsia
Dörtlü +90° +180° +270°
- FFF3A1
Firefly Glow
- BEFFFB
≈ The Big Freeze
- EDEFFF
≈ Carte Blanche
- FFEAEC
≈ Pink Lemonade
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.12:1 · APCA Lc 0
Ag
AAASiyah üzerinde
WCAG 18.58:1 · APCA Lc 99
En iyi metin rengi: #000000
WCAG 18.58:1 (AAA) · APCA Lc 99
Contrast pairs
Kod parçacıkları
CSS
:root {
--firefly-glow: #fff3a1;
--firefly-glow-rgb: 255 243 161;
--firefly-glow-oklch: oklch(0.955 0.103 100.9);
}
.element {
color: var(--firefly-glow);
background-color: hsl(52 100% 82%);
border-color: oklch(0.955 0.103 100.9);
}Tailwind CSS v4
@theme {
--color-firefly-glow: #fff3a1;
--color-firefly-glow-50: #faf7d6;
--color-firefly-glow-100: #eeeac3;
--color-firefly-glow-200: #dcd7a4;
--color-firefly-glow-300: #c1ba7c;
--color-firefly-glow-400: #aca055;
--color-firefly-glow-500: #958829;
--color-firefly-glow-600: #7e7325;
--color-firefly-glow-700: #655c1d;
--color-firefly-glow-800: #4b4312;
--color-firefly-glow-900: #342e0c;
--color-firefly-glow-950: #201b01;
}SCSS
$firefly-glow: #fff3a1;
$firefly-glow-rgb: 255, 243, 161;
$firefly-glow-light: mix(#fff, $firefly-glow, 20%);
$firefly-glow-dark: mix(#000, $firefly-glow, 20%);
.element {
color: $firefly-glow;
box-shadow: 0 0 0 2px rgba($firefly-glow, 0.35);
}