Benannte Farbe · #FDD773
Hawaiian Pineapple
Hawaiian Pineapple ist #FDD773: rgb(253 215 115), hsl(43 97% 72%), oklch(0.892 0.126 88.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Hawaiian Pineapple color name →
#FDD773
oklch(0.892 0.126 88.9)
Farbumrechnungen
- HEX
- #fdd773
- RGB
- rgb(253 215 115)
- HSL
- hsl(43 97% 72%)
- HWB
- hwb(43 45% 1%)
- OKLCH
- oklch(0.892 0.126 88.9)
- OKLab
- oklab(0.892 0.002 0.126)
- CIE Lab
- lab(87.78 5.14 53.8)
- LCH
- lch(87.78 54.05 84.5)
- CMYK
- cmyk(0% 15% 55% 1%)
Tints · Shades · Tones
Tints
- FDDB83
- FEDF93
- FEE4A1
- FEE8B0
- FEECBD
- FEF0CB
- FFF4D8
- FFF7E5
- FFFBF2
Shades
- DCBB63
- BC9F54
- 9D8545
- 7F6B36
- 625228
- 473B1B
- 2D250F
- 161105
- 030201
Tones
- F0CE76
- E3C579
- D6BD7C
- C9B47D
- BDAB7F
- B0A280
- A49A80
- 989180
- 8C8980
Farbharmonien
Komplementär +180°
- FDD773
Hawaiian Pineapple
- CDDBFF
≈ Arc Light
Analog -30° +30°
- FDD773
Hawaiian Pineapple
- FFD1AE
≈ Papaya Whip
- D2E784
≈ Refreshed
Triadisch +120° +240°
- FDD773
Hawaiian Pineapple
- 84EEFF
≈ Photon Projector
- FFC5FB
≈ Sugar Chic
Geteilt komplementär +150° +210°
- FDD773
Hawaiian Pineapple
- B8E2FF
≈ Dithered Sky
- E0D3FF
≈ Pale Lavender
Tetradisch +90° +180° +270°
- FDD773
Hawaiian Pineapple
- 6DF7DD
≈ Tiffany Blue
- CDDBFF
≈ Arc Light
- FFCBDA
≈ Linnet Egg Red
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.38:1 · APCA Lc 19
Ag
AAAAuf Schwarz
WCAG 15.14:1 · APCA Lc 85
Beste Textfarbe: #000000
WCAG 15.14:1 (AAA) · APCA Lc 85
Contrast pairs
Code-Snippets
CSS
:root {
--hawaiian-pineapple: #fdd773;
--hawaiian-pineapple-rgb: 253 215 115;
--hawaiian-pineapple-oklch: oklch(0.892 0.126 88.9);
}
.element {
color: var(--hawaiian-pineapple);
background-color: hsl(43 97% 72%);
border-color: oklch(0.892 0.126 88.9);
}Tailwind CSS v4
@theme {
--color-hawaiian-pineapple: #fdd773;
--color-hawaiian-pineapple-50: #fff5cd;
--color-hawaiian-pineapple-100: #f8e7b8;
--color-hawaiian-pineapple-200: #e8d396;
--color-hawaiian-pineapple-300: #d0b569;
--color-hawaiian-pineapple-400: #bd9a39;
--color-hawaiian-pineapple-500: #a88000;
--color-hawaiian-pineapple-600: #8e6c00;
--color-hawaiian-pineapple-700: #725700;
--color-hawaiian-pineapple-800: #553f00;
--color-hawaiian-pineapple-900: #3b2b00;
--color-hawaiian-pineapple-950: #251800;
}SCSS
$hawaiian-pineapple: #fdd773;
$hawaiian-pineapple-rgb: 253, 215, 115;
$hawaiian-pineapple-light: mix(#fff, $hawaiian-pineapple, 20%);
$hawaiian-pineapple-dark: mix(#000, $hawaiian-pineapple, 20%);
.element {
color: $hawaiian-pineapple;
box-shadow: 0 0 0 2px rgba($hawaiian-pineapple, 0.35);
}