Benoemde kleur · #FFCFAD
Mellow Glow
Mellow Glow is #FFCFAD: rgb(255 207 173), hsl(25 100% 84%), oklch(0.888 0.071 57). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Orange mean? → · Mellow Glow color name →
#FFCFAD
oklch(0.888 0.071 57)
Kleurconversies
- HEX
- #ffcfad
- RGB
- rgb(255 207 173)
- HSL
- hsl(25 100% 84%)
- HWB
- hwb(25 68% 0%)
- OKLCH
- oklch(0.888 0.071 57)
- OKLab
- oklab(0.888 0.039 0.059)
- CIE Lab
- lab(86.76 14.06 23.68)
- LCH
- lch(86.76 27.54 59.3)
- CMYK
- cmyk(0% 19% 32% 0%)
Tinten · Schaduwen · Tonen
Tinten
- FFD4B5
- FFD9BE
- FFDEC6
- FFE2CE
- FFE7D6
- FFECDE
- FFF1E6
- FFF6EF
- FFFAF7
Schaduwen
- DEB496
- BE997F
- 9E7F6A
- 806755
- 634F41
- 48382D
- 2E231B
- 16100B
- 030201
Tonen
- F2C7A9
- E5BFA4
- D8B7A0
- CBAF9B
- BEA797
- B19F92
- A5978E
- 988F89
- 8C8885
Kleurharmonieën
Complementair +180°
- FFCFAD
Mellow Glow
- B3E1FF
≈ Frozen Landscape
Analoog -30° +30°
- FFCFAD
Mellow Glow
- FFCCC5
≈ Piggy Dreams
- EED8A5
≈ Bleached Bone
Triadisch +120° +240°
- FFCFAD
Mellow Glow
- A8EAD9
≈ Oasis Stream
- DED2FF
≈ Pale Lavender
Gesplitst complementair +150° +210°
- FFCFAD
Mellow Glow
- A2E8F2
≈ Uranus
- CADAFF
≈ Icy Plains
Tetradisch +90° +180° +270°
- FFCFAD
Mellow Glow
- BCE7BF
≈ Lime Sorbet
- B3E1FF
≈ Frozen Landscape
- F4CAF3
≈ Sugar High
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.42:1 · APCA Lc 20
Ag
AAAOp zwart
WCAG 14.78:1 · APCA Lc 83
Beste tekstkleur: #000000
WCAG 14.78:1 (AAA) · APCA Lc 83
Contrast pairs
Codefragmenten
CSS
:root {
--mellow-glow: #ffcfad;
--mellow-glow-rgb: 255 207 173;
--mellow-glow-oklch: oklch(0.888 0.071 57);
}
.element {
color: var(--mellow-glow);
background-color: hsl(25 100% 84%);
border-color: oklch(0.888 0.071 57);
}Tailwind CSS v4
@theme {
--color-mellow-glow: #ffcfad;
--color-mellow-glow-50: #fff1e2;
--color-mellow-glow-100: #fbe3d1;
--color-mellow-glow-200: #ecceb7;
--color-mellow-glow-300: #d3af94;
--color-mellow-glow-400: #bf9476;
--color-mellow-glow-500: #aa7a57;
--color-mellow-glow-600: #90684a;
--color-mellow-glow-700: #73533b;
--color-mellow-glow-800: #563c2a;
--color-mellow-glow-900: #3c291c;
--color-mellow-glow-950: #25170d;
}SCSS
$mellow-glow: #ffcfad;
$mellow-glow-rgb: 255, 207, 173;
$mellow-glow-light: mix(#fff, $mellow-glow, 20%);
$mellow-glow-dark: mix(#000, $mellow-glow, 20%);
.element {
color: $mellow-glow;
box-shadow: 0 0 0 2px rgba($mellow-glow, 0.35);
}