Benannte Farbe · #FFF0A4
Buttered Popcorn
Buttered Popcorn ist #FFF0A4: rgb(255 240 164), hsl(50 100% 82%), oklch(0.95 0.096 98.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Buttered Popcorn color name →
#FFF0A4
oklch(0.95 0.096 98.4)
Farbumrechnungen
- HEX
- #fff0a4
- RGB
- rgb(255 240 164)
- HSL
- hsl(50 100% 82%)
- HWB
- hwb(50 64% 0%)
- OKLCH
- oklch(0.95 0.096 98.4)
- OKLab
- oklab(0.95 -0.014 0.095)
- CIE Lab
- lab(94.72 -2.64 38.71)
- LCH
- lch(94.72 38.8 93.9)
- CMYK
- cmyk(0% 6% 36% 0%)
Tints · Shades · Tones
Tints
- FFF2AE
- FFF3B7
- FFF5C1
- FFF6CA
- FFF8D3
- FFF9DC
- FFFBE5
- FFFCEE
- FFFEF6
Shades
- DED18E
- BEB279
- 9E9564
- 807850
- 635D3D
- 48432B
- 2E2A1A
- 16140A
- 030301
Tones
- F2E4A1
- E4D99E
- D7CD9B
- CAC297
- BDB794
- B1AC90
- A4A18C
- 989688
- 8C8B84
Farbharmonien
Komplementär +180°
- FFF0A4
Buttered Popcorn
- EAEDFF
≈ Brilliant White
Analog -30° +30°
- FFF0A4
Buttered Popcorn
- FFEBD6
≈ Winter Morning
- DBFCB6
≈ Greedy Green
Triadisch +120° +240°
- FFF0A4
Buttered Popcorn
- D5F5FF
≈ Water
- FFE6F6
≈ Dolomite Crystal
Geteilt komplementär +150° +210°
- FFF0A4
Buttered Popcorn
- E2F0FF
≈ Wizard White
- F4E9FF
≈ Placebo Purple
Tetradisch +90° +180° +270°
- FFF0A4
Buttered Popcorn
- B6FFF8
≈ Winter Meadow
- EAEDFF
≈ Brilliant White
- FFE8EB
≈ Porcelain Skin
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.15:1 · APCA Lc 0
Ag
AAAAuf Schwarz
WCAG 18.25:1 · APCA Lc 97
Beste Textfarbe: #000000
WCAG 18.25:1 (AAA) · APCA Lc 97
Contrast pairs
Code-Snippets
CSS
:root {
--buttered-popcorn: #fff0a4;
--buttered-popcorn-rgb: 255 240 164;
--buttered-popcorn-oklch: oklch(0.95 0.096 98.4);
}
.element {
color: var(--buttered-popcorn);
background-color: hsl(50 100% 82%);
border-color: oklch(0.95 0.096 98.4);
}Tailwind CSS v4
@theme {
--color-buttered-popcorn: #fff0a4;
--color-buttered-popcorn-50: #fbf6d7;
--color-buttered-popcorn-100: #efe9c5;
--color-buttered-popcorn-200: #ddd6a7;
--color-buttered-popcorn-300: #c2b97f;
--color-buttered-popcorn-400: #ad9f5a;
--color-buttered-popcorn-500: #978731;
--color-buttered-popcorn-600: #80722c;
--color-buttered-popcorn-700: #665b23;
--color-buttered-popcorn-800: #4c4217;
--color-buttered-popcorn-900: #352e0e;
--color-buttered-popcorn-950: #201a02;
}SCSS
$buttered-popcorn: #fff0a4;
$buttered-popcorn-rgb: 255, 240, 164;
$buttered-popcorn-light: mix(#fff, $buttered-popcorn, 20%);
$buttered-popcorn-dark: mix(#000, $buttered-popcorn, 20%);
.element {
color: $buttered-popcorn;
box-shadow: 0 0 0 2px rgba($buttered-popcorn, 0.35);
}