命名颜色 · #FE9C7B
Creamy Orange Blush
Creamy Orange Blush 即 #FE9C7B:rgb(254 156 123)、hsl(15 98% 74%)、oklch(0.786 0.126 39.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Creamy Orange Blush color name →
#FE9C7B
oklch(0.786 0.126 39.3)
颜色转换
- HEX
- #fe9c7b
- RGB
- rgb(254 156 123)
- HSL
- hsl(15 98% 74%)
- HWB
- hwb(15 48% 0%)
- OKLCH
- oklch(0.786 0.126 39.3)
- OKLab
- oklab(0.786 0.098 0.08)
- CIE Lab
- lab(74.24 35.15 33.54)
- LCH
- lch(74.24 48.58 43.7)
- CMYK
- cmyk(0% 39% 52% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFA688
- FFB096
- FFBBA3
- FFC4B0
- FFCEBD
- FFD8CA
- FFE2D7
- FFECE5
- FFF5F2
深色调
- DD876A
- BD735A
- 9E5F4A
- 804C3A
- 63392C
- 47281E
- 2D1810
- 160905
- 030101
灰色调
- F19A7C
- E5977D
- D8957E
- CC927F
- BF8F7F
- B38D80
- A68A80
- 9A8680
- 8D8380
配色和谐
互补色 +180°
- FE9C7B
Creamy Orange Blush
- 40CCF0
≈ Picnic Day Sky
类似色 -30° +30°
- FE9C7B
Creamy Orange Blush
- FE96A8
≈ Fight the Sunrise
- EDAA58
≈ Polished Gold
三角配色 +120° +240°
- FE9C7B
Creamy Orange Blush
- 68D29C
≈ Van Gogh Green
- AAB2FF
≈ Winterspring Lilac
分裂互补色 +150° +210°
- FE9C7B
Creamy Orange Blush
- 33D3CA
≈ Turquoise Panic
- 7FBFFF
≈ Scenic Water
四角配色 +90° +180° +270°
- FE9C7B
Creamy Orange Blush
- 9FC96F
≈ Alverda
- 40CCF0
≈ Picnic Day Sky
- D1A2F6
≈ Lilac
对比度与无障碍
Ag
Fail白底
WCAG 2.04:1 · APCA Lc 40
Ag
AAA黑底
WCAG 10.25:1 · APCA Lc 63
最佳文字颜色: #000000
WCAG 10.25:1 (AAA) · APCA Lc 63
Contrast pairs
代码片段
CSS
:root {
--creamy-orange-blush: #fe9c7b;
--creamy-orange-blush-rgb: 254 156 123;
--creamy-orange-blush-oklch: oklch(0.786 0.126 39.3);
}
.element {
color: var(--creamy-orange-blush);
background-color: hsl(15 98% 74%);
border-color: oklch(0.786 0.126 39.3);
}Tailwind CSS v4
@theme {
--color-creamy-orange-blush: #fe9c7b;
--color-creamy-orange-blush-50: #ffeada;
--color-creamy-orange-blush-100: #ffdbc8;
--color-creamy-orange-blush-200: #ffc3ab;
--color-creamy-orange-blush-300: #efa285;
--color-creamy-orange-blush-400: #dd8364;
--color-creamy-orange-blush-500: #cb6441;
--color-creamy-orange-blush-600: #ab5638;
--color-creamy-orange-blush-700: #89442d;
--color-creamy-orange-blush-800: #673121;
--color-creamy-orange-blush-900: #482115;
--color-creamy-orange-blush-950: #2f1007;
}SCSS
$creamy-orange-blush: #fe9c7b;
$creamy-orange-blush-rgb: 254, 156, 123;
$creamy-orange-blush-light: mix(#fff, $creamy-orange-blush, 20%);
$creamy-orange-blush-dark: mix(#000, $creamy-orange-blush, 20%);
.element {
color: $creamy-orange-blush;
box-shadow: 0 0 0 2px rgba($creamy-orange-blush, 0.35);
}