Benoemde kleur · #FFBB8F
Fuzzy Peach
Fuzzy Peach is #FFBB8F: rgb(255 187 143), hsl(24 100% 78%), oklch(0.845 0.098 53.9). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Orange mean? → · Fuzzy Peach color name →
#FFBB8F
oklch(0.845 0.098 53.9)
Kleurconversies
- HEX
- #ffbb8f
- RGB
- rgb(255 187 143)
- HSL
- hsl(24 100% 78%)
- HWB
- hwb(24 56% 0%)
- OKLCH
- oklch(0.845 0.098 53.9)
- OKLab
- oklab(0.845 0.058 0.079)
- CIE Lab
- lab(81.59 21.5 32.45)
- LCH
- lch(81.59 38.93 56.5)
- CMYK
- cmyk(0% 27% 44% 0%)
Tinten · Schaduwen · Tonen
Tinten
- FFC29A
- FFC9A6
- FFD0B1
- FFD7BC
- FFDDC7
- FFE4D3
- FFEBDE
- FFF2E9
- FFF8F4
Schaduwen
- DEA27C
- BE8A69
- 9E7357
- 805C45
- 634634
- 483224
- 2E1F15
- 160D07
- 030201
Tonen
- F2B58E
- E5AF8D
- D8A98C
- CBA48A
- BF9E89
- B29887
- A59286
- 998C84
- 8C8682
Kleurharmonieën
Complementair +180°
- FFBB8F
Fuzzy Peach
- 8ED7FF
≈ Kul Sharif Blue
Analoog -30° +30°
- FFBB8F
Fuzzy Peach
- FFB7B1
≈ Mexican Milk
- EBC780
≈ Marzipan
Triadisch +120° +240°
- FFBB8F
Fuzzy Peach
- 83E1C7
≈ Clean Green
- CEC2FF
≈ Innocent Snowdrop
Gesplitst complementair +150° +210°
- FFBB8F
Fuzzy Peach
- 77DFE9
≈ Turkish Turquoise
- B3CCFF
≈ Night Snow
Tetradisch +90° +180° +270°
- FFBB8F
Fuzzy Peach
- A5DDA4
≈ Cool Aloe
- 8ED7FF
≈ Kul Sharif Blue
- ECB7F1
≈ Lovecloud
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.64:1 · APCA Lc 29
Ag
AAAOp zwart
WCAG 12.75:1 · APCA Lc 74
Beste tekstkleur: #000000
WCAG 12.75:1 (AAA) · APCA Lc 74
Contrast pairs
Codefragmenten
CSS
:root {
--fuzzy-peach: #ffbb8f;
--fuzzy-peach-rgb: 255 187 143;
--fuzzy-peach-oklch: oklch(0.845 0.098 53.9);
}
.element {
color: var(--fuzzy-peach);
background-color: hsl(24 100% 78%);
border-color: oklch(0.845 0.098 53.9);
}Tailwind CSS v4
@theme {
--color-fuzzy-peach: #ffbb8f;
--color-fuzzy-peach-50: #ffefdb;
--color-fuzzy-peach-100: #ffe0c9;
--color-fuzzy-peach-200: #f6caad;
--color-fuzzy-peach-300: #dfab87;
--color-fuzzy-peach-400: #cc8e66;
--color-fuzzy-peach-500: #b87343;
--color-fuzzy-peach-600: #9c623a;
--color-fuzzy-peach-700: #7d4e2e;
--color-fuzzy-peach-800: #5d3821;
--color-fuzzy-peach-900: #412616;
--color-fuzzy-peach-950: #2a1407;
}SCSS
$fuzzy-peach: #ffbb8f;
$fuzzy-peach-rgb: 255, 187, 143;
$fuzzy-peach-light: mix(#fff, $fuzzy-peach, 20%);
$fuzzy-peach-dark: mix(#000, $fuzzy-peach, 20%);
.element {
color: $fuzzy-peach;
box-shadow: 0 0 0 2px rgba($fuzzy-peach, 0.35);
}