Named color · #FFCFAB
Peach Juice
Peach Juice is #FFCFAB: rgb(255 207 171), hsl(26 100% 84%), oklch(0.887 0.072 58.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Peach Juice color name →
#FFCFAB
oklch(0.887 0.072 58.5)
Color conversions
- HEX
- #ffcfab
- RGB
- rgb(255 207 171)
- HSL
- hsl(26 100% 84%)
- HWB
- hwb(26 67% 0%)
- OKLCH
- oklch(0.887 0.072 58.5)
- OKLab
- oklab(0.887 0.038 0.062)
- CIE Lab
- lab(86.73 13.88 24.68)
- LCH
- lch(86.73 28.31 60.7)
- CMYK
- cmyk(0% 19% 33% 0%)
Tints · Shades · Tones
Tints
- FFD4B4
- FFD9BC
- FFDEC4
- FFE2CD
- FFE7D5
- FFECDE
- FFF1E6
- FFF6EE
- FFFAF7
Shades
- DEB494
- BE997E
- 9E7F68
- 806754
- 634F40
- 48382D
- 2E231B
- 16100B
- 030201
Tones
- F2C7A7
- E5BFA3
- D8B79E
- CBAF9A
- BEA796
- B19F92
- A5978D
- 988F89
- 8C8884
Color harmonies
Complementary +180°
- FFCFAB
Peach Juice
- B5E1FF
≈ Dithered Sky
Analogous -30° +30°
- FFCFAB
Peach Juice
- FFCCC4
≈ Piggy Dreams
- EDD8A3
≈ Subtle Glow
Triadic +120° +240°
- FFCFAB
Peach Juice
- A5EADA
≈ Oasis Stream
- DFD1FF
≈ Pale Lavender
Split-complementary +150° +210°
- FFCFAB
Peach Juice
- A1E8F3
≈ Uranus
- CBD9FF
≈ Icy Plains
Tetradic +90° +180° +270°
- FFCFAB
Peach Juice
- BAE8C0
≈ Mint Parfait
- B5E1FF
≈ Dithered Sky
- F5CAF2
≈ Kissed by Mist
Contrast & accessibility
Ag
FailOn white
WCAG 1.42:1 · APCA Lc 20
Ag
AAAOn black
WCAG 14.76:1 · APCA Lc 83
Best text color: #000000
WCAG 14.76:1 (AAA) · APCA Lc 83
Contrast pairs
Code snippets
CSS
:root {
--peach-juice: #ffcfab;
--peach-juice-rgb: 255 207 171;
--peach-juice-oklch: oklch(0.887 0.072 58.5);
}
.element {
color: var(--peach-juice);
background-color: hsl(26 100% 84%);
border-color: oklch(0.887 0.072 58.5);
}Tailwind CSS v4
@theme {
--color-peach-juice: #ffcfab;
--color-peach-juice-50: #fff1e1;
--color-peach-juice-100: #fbe3d0;
--color-peach-juice-200: #ecceb6;
--color-peach-juice-300: #d4af92;
--color-peach-juice-400: #bf9474;
--color-peach-juice-500: #aa7a55;
--color-peach-juice-600: #906848;
--color-peach-juice-700: #73533a;
--color-peach-juice-800: #563c29;
--color-peach-juice-900: #3c291c;
--color-peach-juice-950: #25170c;
}SCSS
$peach-juice: #ffcfab;
$peach-juice-rgb: 255, 207, 171;
$peach-juice-light: mix(#fff, $peach-juice, 20%);
$peach-juice-dark: mix(#000, $peach-juice, 20%);
.element {
color: $peach-juice;
box-shadow: 0 0 0 2px rgba($peach-juice, 0.35);
}