Adlandırılmış renk · #EAD988
Pineapple Whip
Pineapple Whip, #EAD988: rgb(234 217 136), hsl(50 70% 73%), oklch(0.881 0.103 97.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Pineapple Whip color name →
#EAD988
oklch(0.881 0.103 97.8)
Renk dönüşümleri
- HEX
- #ead988
- RGB
- rgb(234 217 136)
- HSL
- hsl(50 70% 73%)
- HWB
- hwb(50 53% 8%)
- OKLCH
- oklch(0.881 0.103 97.8)
- OKLab
- oklab(0.881 -0.014 0.102)
- CIE Lab
- lab(86.77 -2.06 42.04)
- LCH
- lch(86.77 42.09 92.8)
- CMYK
- cmyk(0% 7% 42% 8%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- ECDD95
- EEE1A1
- F0E5AE
- F2E9BA
- F4ECC5
- F6F0D1
- F9F4DD
- FBF8E8
- FDFBF4
Koyu tonlar
- CBBC75
- AEA163
- 918652
- 756C41
- 5A5331
- 413B22
- 292513
- 131106
- 030201
Gri tonlar
- DFD088
- D4C788
- C9BE88
- BEB587
- B3AC87
- A9A386
- 9E9A85
- 949183
- 8A8982
Renk uyumları
Tamamlayıcı +180°
- EAD988
Pineapple Whip
- CED5FF
≈ Pale Phthalo Blue
Analog -30° +30°
- EAD988
Pineapple Whip
- FFCE9A
≈ Atoll Sand
- C5E59B
≈ Field Day
Üçlü +120° +240°
- EAD988
Pineapple Whip
- 91E7FF
≈ Winter Wizard
- FFC2ED
≈ Pretty in Pink
Bölünmüş tamamlayıcı +150° +210°
- EAD988
Pineapple Whip
- B9DCFF
≈ Broad Daylight
- E6CBFF
≈ Lens Flare Pink
Dörtlü +90° +180° +270°
- EAD988
Pineapple Whip
- 80EEE4
≈ Dead Sea
- CED5FF
≈ Pale Phthalo Blue
- FFC7D0
≈ Sweet Sixteen
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.42:1 · APCA Lc 20
Ag
AAASiyah üzerinde
WCAG 14.77:1 · APCA Lc 83
En iyi metin rengi: #000000
WCAG 14.77:1 (AAA) · APCA Lc 83
Contrast pairs
Kod parçacıkları
CSS
:root {
--pineapple-whip: #ead988;
--pineapple-whip-rgb: 234 217 136;
--pineapple-whip-oklch: oklch(0.881 0.103 97.8);
}
.element {
color: var(--pineapple-whip);
background-color: hsl(50 70% 73%);
border-color: oklch(0.881 0.103 97.8);
}Tailwind CSS v4
@theme {
--color-pineapple-whip: #ead988;
--color-pineapple-whip-50: #fcf6d5;
--color-pineapple-whip-100: #f0e9c2;
--color-pineapple-whip-200: #ded6a3;
--color-pineapple-whip-300: #c4b97b;
--color-pineapple-whip-400: #af9f54;
--color-pineapple-whip-500: #998627;
--color-pineapple-whip-600: #817223;
--color-pineapple-whip-700: #675b1c;
--color-pineapple-whip-800: #4d4212;
--color-pineapple-whip-900: #362d0b;
--color-pineapple-whip-950: #211a01;
}SCSS
$pineapple-whip: #ead988;
$pineapple-whip-rgb: 234, 217, 136;
$pineapple-whip-light: mix(#fff, $pineapple-whip, 20%);
$pineapple-whip-dark: mix(#000, $pineapple-whip, 20%);
.element {
color: $pineapple-whip;
box-shadow: 0 0 0 2px rgba($pineapple-whip, 0.35);
}