命名颜色 · #FFE0AF
Creamy Oat
Creamy Oat 即 #FFE0AF：rgb(255 224 175)、hsl(37 100% 84%)、oklch(0.921 0.072 79)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Creamy Oat color name →
#FFE0AF
oklch(0.921 0.072 79)
颜色转换
- HEX
- #ffe0af
- RGB
- rgb(255 224 175)
- HSL
- hsl(37 100% 84%)
- HWB
- hwb(37 69% 0%)
- OKLCH
- oklch(0.921 0.072 79)
- OKLab
- oklab(0.921 0.014 0.071)
- CIE Lab
- lab(90.91 5.95 28.21)
- LCH
- lch(90.91 28.83 78.1)
- CMYK
- cmyk(0% 12% 31% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFE3B7
- FFE6BF
- FFE9C8
- FFEDD0
- FFF0D8
- FFF3E0
- FFF6E7
- FFF9EF
- FFFCF7
深色调
- DEC398
- BEA681
- 9E8A6B
- 807056
- 635641
- 483E2E
- 2E271C
- 16120B
- 030201
灰色调
- F2D6AB
- E4CCA6
- D7C2A1
- CAB99D
- BEAF98
- B1A593
- A59C8F
- 98938A
- 8C8985
配色和谐
互补色 +180°
- FFE0AF
Creamy Oat
- D6E6FF
≈ Veiling Waterfalls
类似色 -30° +30°
- FFE0AF
Creamy Oat
- FFDDCB
≈ Unbleached Silk
- E8E9B2
≈ Steamy Dumpling
三角配色 +120° +240°
- FFE0AF
Creamy Oat
- ABF4F7
≈ Waterspout
- F7D9FF
≈ Lavender Savour
分裂互补色 +150° +210°
- FFE0AF
Creamy Oat
- C5ECFF
≈ Blue Java Banana
- E3E1FF
≈ Stoic White
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.27:1 · APCA Lc 13
Ag
AAA黑底
WCAG 16.53:1 · APCA Lc 91
最佳文字颜色: #000000
WCAG 16.53:1 (AAA) · APCA Lc 91
Contrast pairs
代码片段
CSS
:root {
--creamy-oat: #ffe0af;
--creamy-oat-rgb: 255 224 175;
--creamy-oat-oklch: oklch(0.921 0.072 79);
}
.element {
color: var(--creamy-oat);
background-color: hsl(37 100% 84%);
border-color: oklch(0.921 0.072 79);
}Tailwind CSS v4
@theme {
--color-creamy-oat: #ffe0af;
--color-creamy-oat-50: #fff4df;
--color-creamy-oat-100: #f4e6ce;
--color-creamy-oat-200: #e4d2b2;
--color-creamy-oat-300: #cab48e;
--color-creamy-oat-400: #b69a6e;
--color-creamy-oat-500: #a0814d;
--color-creamy-oat-600: #876d42;
--color-creamy-oat-700: #6c5734;
--color-creamy-oat-800: #503f25;
--color-creamy-oat-900: #382b19;
--color-creamy-oat-950: #231909;
}SCSS
$creamy-oat: #ffe0af;
$creamy-oat-rgb: 255, 224, 175;
$creamy-oat-light: mix(#fff, $creamy-oat, 20%);
$creamy-oat-dark: mix(#000, $creamy-oat, 20%);
.element {
color: $creamy-oat;
box-shadow: 0 0 0 2px rgba($creamy-oat, 0.35);
}