Nazwany kolor · #E4D0A5
Lucent Yellow
Lucent Yellow to #E4D0A5: rgb(228 208 165), hsl(41 54% 77%), oklch(0.863 0.061 85.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Lucent Yellow color name →
#E4D0A5
oklch(0.863 0.061 85.9)
Konwersje koloru
- HEX
- #e4d0a5
- RGB
- rgb(228 208 165)
- HSL
- hsl(41 54% 77%)
- HWB
- hwb(41 65% 11%)
- OKLCH
- oklch(0.863 0.061 85.9)
- OKLab
- oklab(0.863 0.004 0.061)
- CIE Lab
- lab(84.36 2.43 24.1)
- LCH
- lch(84.36 24.22 84.2)
- CMYK
- cmyk(0% 9% 28% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E7D5AE
- E9D9B7
- ECDEC0
- EFE3C9
- F2E8D2
- F4ECDB
- F7F1E4
- FAF6ED
- FCFAF6
Odcienie ciemniejsze
- C6B58F
- A99A79
- 8D8065
- 726751
- 584F3D
- 3F392B
- 28231A
- 12100A
- 030201
Tony
- DAC8A1
- CFC09E
- C5B79A
- BBAF97
- B1A793
- A79F8F
- 9D978C
- 939088
- 8A8884
Harmonie kolorów
Komplementarna +180°
- E4D0A5
Lucent Yellow
- BFD2FB
≈ Ice Cold Stare
Analogowa -30° +30°
- E4D0A5
Lucent Yellow
- F2C9AC
≈ Pastel Peach
- D0D8AA
≈ White Jade
Triada +120° +240°
- E4D0A5
Lucent Yellow
- A3DEE6
≈ Charlotte
- E8C5E8
≈ Prom Corsage
Komplementarna rozszczepiona +150° +210°
- E4D0A5
Lucent Yellow
- ACD9F5
≈ Blue Rice
- D5CBF6
≈ Soap
Tetrada +90° +180° +270°
- E4D0A5
Lucent Yellow
- A8E0D0
≈ Meristem
- BFD2FB
≈ Ice Cold Stare
- F4C2D3
≈ Cherry Blossom
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.51:1 · APCA Lc 24
Ag
AAANa czerni
WCAG 13.86:1 · APCA Lc 79
Najlepszy kolor tekstu: #000000
WCAG 13.86:1 (AAA) · APCA Lc 79
Contrast pairs
Fragmenty kodu
CSS
:root {
--lucent-yellow: #e4d0a5;
--lucent-yellow-rgb: 228 208 165;
--lucent-yellow-oklch: oklch(0.863 0.061 85.9);
}
.element {
color: var(--lucent-yellow);
background-color: hsl(41 54% 77%);
border-color: oklch(0.863 0.061 85.9);
}Tailwind CSS v4
@theme {
--color-lucent-yellow: #e4d0a5;
--color-lucent-yellow-50: #fcf5e2;
--color-lucent-yellow-100: #f0e7d1;
--color-lucent-yellow-200: #dfd3b7;
--color-lucent-yellow-300: #c4b694;
--color-lucent-yellow-400: #af9c75;
--color-lucent-yellow-500: #988457;
--color-lucent-yellow-600: #816f4a;
--color-lucent-yellow-700: #67593b;
--color-lucent-yellow-800: #4c412a;
--color-lucent-yellow-900: #352d1c;
--color-lucent-yellow-950: #201a0c;
}SCSS
$lucent-yellow: #e4d0a5;
$lucent-yellow-rgb: 228, 208, 165;
$lucent-yellow-light: mix(#fff, $lucent-yellow, 20%);
$lucent-yellow-dark: mix(#000, $lucent-yellow, 20%);
.element {
color: $lucent-yellow;
box-shadow: 0 0 0 2px rgba($lucent-yellow, 0.35);
}