命名颜色 · #FFCFAB
Peach Juice
Peach Juice 即 #FFCFAB:rgb(255 207 171)、hsl(26 100% 84%)、oklch(0.887 0.072 58.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Peach Juice color name →
#FFCFAB
oklch(0.887 0.072 58.5)
颜色转换
- 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%)
浅色调 · 深色调 · 灰色调
浅色调
- FFD4B4
- FFD9BC
- FFDEC4
- FFE2CD
- FFE7D5
- FFECDE
- FFF1E6
- FFF6EE
- FFFAF7
深色调
- DEB494
- BE997E
- 9E7F68
- 806754
- 634F40
- 48382D
- 2E231B
- 16100B
- 030201
灰色调
- F2C7A7
- E5BFA3
- D8B79E
- CBAF9A
- BEA796
- B19F92
- A5978D
- 988F89
- 8C8884
配色和谐
互补色 +180°
- FFCFAB
Peach Juice
- B5E1FF
≈ Dithered Sky
类似色 -30° +30°
- FFCFAB
Peach Juice
- FFCCC4
≈ Piggy Dreams
- EDD8A3
≈ Subtle Glow
三角配色 +120° +240°
- FFCFAB
Peach Juice
- A5EADA
≈ Oasis Stream
- DFD1FF
≈ Pale Lavender
分裂互补色 +150° +210°
- FFCFAB
Peach Juice
- A1E8F3
≈ Uranus
- CBD9FF
≈ Icy Plains
四角配色 +90° +180° +270°
- FFCFAB
Peach Juice
- BAE8C0
≈ Mint Parfait
- B5E1FF
≈ Dithered Sky
- F5CAF2
≈ Kissed by Mist
对比度与无障碍
Ag
Fail白底
WCAG 1.42:1 · APCA Lc 20
Ag
AAA黑底
WCAG 14.76:1 · APCA Lc 83
最佳文字颜色: #000000
WCAG 14.76:1 (AAA) · APCA Lc 83
Contrast pairs
代码片段
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);
}