Benoemde kleur · #FFB96F
Cheese Puff
Cheese Puff is #FFB96F: rgb(255 185 111), hsl(31 100% 72%), oklch(0.836 0.122 66.4). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Orange mean? → · Cheese Puff color name →
#FFB96F
oklch(0.836 0.122 66.4)
Kleurconversies
- HEX
- #ffb96f
- RGB
- rgb(255 185 111)
- HSL
- hsl(31 100% 72%)
- HWB
- hwb(31 44% 0%)
- OKLCH
- oklch(0.836 0.122 66.4)
- OKLab
- oklab(0.836 0.049 0.112)
- CIE Lab
- lab(80.73 20.46 47.62)
- LCH
- lch(80.73 51.83 66.7)
- CMYK
- cmyk(0% 27% 56% 0%)
Tinten · Schaduwen · Tonen
Tinten
- FFC07F
- FFC88E
- FFCF9D
- FFD6AB
- FFDDBA
- FFE4C8
- FFEBD6
- FFF1E3
- FFF8F1
Schaduwen
- DEA060
- BE8951
- 9E7142
- 805B34
- 634627
- 48311A
- 2E1E0E
- 160D04
- 030201
Tonen
- F2B372
- E5AE75
- D8A878
- CBA37A
- BF9D7C
- B2977D
- A5927E
- 998C7F
- 8C8680
Kleurharmonieën
Complementair +180°
- FFB96F
Cheese Puff
- 9BCFFF
≈ Baby Blue
Analoog -30° +30°
- FFB96F
Cheese Puff
- FFB49F
≈ Persicus
- E0C967
≈ Pirate Treasure
Triadisch +120° +240°
- FFB96F
Cheese Puff
- 56E3D6
≈ Near Moon
- DAB8FF
≈ Lavender Fragrance
Gesplitst complementair +150° +210°
- FFB96F
Cheese Puff
- 58DDFC
≈ Ionized-Air Glow
- BBC5FF
≈ Light Periwinkle
Tetradisch +90° +180° +270°
- FFB96F
Cheese Puff
- 82E1A8
≈ Jovial Jade
- 9BCFFF
≈ Baby Blue
- FCAAE7
≈ Pink Wink
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.69:1 · APCA Lc 30
Ag
AAAOp zwart
WCAG 12.42:1 · APCA Lc 73
Beste tekstkleur: #000000
WCAG 12.42:1 (AAA) · APCA Lc 73
Contrast pairs
Codefragmenten
CSS
:root {
--cheese-puff: #ffb96f;
--cheese-puff-rgb: 255 185 111;
--cheese-puff-oklch: oklch(0.836 0.122 66.4);
}
.element {
color: var(--cheese-puff);
background-color: hsl(31 100% 72%);
border-color: oklch(0.836 0.122 66.4);
}Tailwind CSS v4
@theme {
--color-cheese-puff: #ffb96f;
--color-cheese-puff-50: #fff0d1;
--color-cheese-puff-100: #ffe1bd;
--color-cheese-puff-200: #f7cb9c;
--color-cheese-puff-300: #e1ac71;
--color-cheese-puff-400: #cf8f49;
--color-cheese-puff-500: #bb730e;
--color-cheese-puff-600: #9e6212;
--color-cheese-puff-700: #7f4e0f;
--color-cheese-puff-800: #5f380a;
--color-cheese-puff-900: #432606;
--color-cheese-puff-950: #2b1400;
}SCSS
$cheese-puff: #ffb96f;
$cheese-puff-rgb: 255, 185, 111;
$cheese-puff-light: mix(#fff, $cheese-puff, 20%);
$cheese-puff-dark: mix(#000, $cheese-puff, 20%);
.element {
color: $cheese-puff;
box-shadow: 0 0 0 2px rgba($cheese-puff, 0.35);
}