Benannte Farbe · #EDDA8F
Pineapple Crush
Pineapple Crush ist #EDDA8F: rgb(237 218 143), hsl(48 72% 75%), oklch(0.887 0.097 95.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Pineapple Crush color name →
#EDDA8F
oklch(0.887 0.097 95.6)
Farbumrechnungen
- HEX
- #edda8f
- RGB
- rgb(237 218 143)
- HSL
- hsl(48 72% 75%)
- HWB
- hwb(48 56% 7%)
- OKLCH
- oklch(0.887 0.097 95.6)
- OKLab
- oklab(0.887 -0.009 0.096)
- CIE Lab
- lab(87.37 -0.83 39.39)
- LCH
- lch(87.37 39.4 91.2)
- CMYK
- cmyk(0% 8% 40% 7%)
Tints · Shades · Tones
Tints
- EFDE9B
- F1E2A7
- F2E5B2
- F4E9BD
- F6EDC9
- F8F1D4
- FAF4DF
- FBF8E9
- FDFBF4
Shades
- CEBD7C
- B0A269
- 938757
- 776C45
- 5C5434
- 423C24
- 2A2515
- 141107
- 030201
Tones
- E2D18E
- D6C88D
- CBBE8C
- C0B58B
- B5AC8A
- AAA388
- 9F9A86
- 959284
- 8A8982
Farbharmonien
Komplementär +180°
- EDDA8F
Pineapple Crush
- CFD8FF
≈ Icy Plains
Analog -30° +30°
- EDDA8F
Pineapple Crush
- FFD0A2
≈ Orange Canyon
- CAE69F
≈ Field Day
Triadisch +120° +240°
- EDDA8F
Pineapple Crush
- 93E9FF
≈ Winter Wizard
- FFC5F0
≈ Rosy Maple Moth
Geteilt komplementär +150° +210°
- EDDA8F
Pineapple Crush
- BBDFFF
≈ Dithered Sky
- E5CFFF
≈ Lens Flare Pink
Tetradisch +90° +180° +270°
- EDDA8F
Pineapple Crush
- 8AEFE3
≈ Turquoise Pearl
- CFD8FF
≈ Icy Plains
- FFC9D4
≈ Sweet Sixteen
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.39:1 · APCA Lc 19
Ag
AAAAuf Schwarz
WCAG 15.02:1 · APCA Lc 84
Beste Textfarbe: #000000
WCAG 15.02:1 (AAA) · APCA Lc 84
Contrast pairs
Code-Snippets
CSS
:root {
--pineapple-crush: #edda8f;
--pineapple-crush-rgb: 237 218 143;
--pineapple-crush-oklch: oklch(0.887 0.097 95.6);
}
.element {
color: var(--pineapple-crush);
background-color: hsl(48 72% 75%);
border-color: oklch(0.887 0.097 95.6);
}Tailwind CSS v4
@theme {
--color-pineapple-crush: #edda8f;
--color-pineapple-crush-50: #fcf6d7;
--color-pineapple-crush-100: #f0e9c4;
--color-pineapple-crush-200: #dfd5a6;
--color-pineapple-crush-300: #c5b87e;
--color-pineapple-crush-400: #b09e59;
--color-pineapple-crush-500: #9a8530;
--color-pineapple-crush-600: #82712a;
--color-pineapple-crush-700: #685a22;
--color-pineapple-crush-800: #4e4116;
--color-pineapple-crush-900: #362d0e;
--color-pineapple-crush-950: #211a02;
}SCSS
$pineapple-crush: #edda8f;
$pineapple-crush-rgb: 237, 218, 143;
$pineapple-crush-light: mix(#fff, $pineapple-crush, 20%);
$pineapple-crush-dark: mix(#000, $pineapple-crush, 20%);
.element {
color: $pineapple-crush;
box-shadow: 0 0 0 2px rgba($pineapple-crush, 0.35);
}