命名颜色 · #FCE166
Xìng Huáng Yellow
Xìng Huáng Yellow 即 #FCE166：rgb(252 225 102)、hsl(49 96% 69%)、oklch(0.909 0.144 97)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Xìng Huáng Yellow color name →
#FCE166
oklch(0.909 0.144 97)
颜色转换
- HEX
- #fce166
- RGB
- rgb(252 225 102)
- HSL
- hsl(49 96% 69%)
- HWB
- hwb(49 40% 1%)
- OKLCH
- oklch(0.909 0.144 97)
- OKLab
- oklab(0.909 -0.018 0.143)
- CIE Lab
- lab(90.06 -0.75 62.13)
- LCH
- lch(90.06 62.14 90.7)
- CMYK
- cmyk(0% 11% 60% 1%)
浅色调 · 深色调 · 灰色调
浅色调
- FCE479
- FCE88B
- FDEB9B
- FDEEAB
- FDF1B9
- FEF4C8
- FEF7D6
- FEFAE4
- FFFCF2
深色调
- DBC458
- BBA74A
- 9C8B3C
- 7E702F
- 625623
- 473E17
- 2D270C
- 161204
- 030200
灰色调
- EFD76C
- E2CD71
- D5C375
- C8BA78
- BCB07B
- B0A67D
- A39D7E
- 97937F
- 8C8A80
配色和谐
互补色 +180°
- FCE166
Xìng Huáng Yellow
- D9DFFF
≈ Contrail
类似色 -30° +30°
- FCE166
Xìng Huáng Yellow
- FFD9B4
≈ Sandy Tan
- C7F386
≈ Cucumber Milk
三角配色 +120° +240°
- FCE166
Xìng Huáng Yellow
- ADEDFF
≈ Beyond the Clouds
- FFD1F1
≈ Shampoo
分裂互补色 +150° +210°
- FCE166
Xìng Huáng Yellow
- C9E5FF
≈ Fresh Water
- EBD8FF
≈ Lavender Savour
四角配色 +90° +180° +270°
- FCE166
Xìng Huáng Yellow
- 4FFFF1
≈ Icy Life
- D9DFFF
≈ Contrail
- FFD4DB
≈ No Need to Blush
对比度与无障碍
Ag
Fail白底
WCAG 1.30:1 · APCA Lc 15
Ag
AAA黑底
WCAG 16.10:1 · APCA Lc 89
最佳文字颜色: #000000
WCAG 16.10:1 (AAA) · APCA Lc 89
Contrast pairs
代码片段
CSS
:root {
--xing-huang-yellow: #fce166;
--xing-huang-yellow-rgb: 252 225 102;
--xing-huang-yellow-oklch: oklch(0.909 0.144 97);
}
.element {
color: var(--xing-huang-yellow);
background-color: hsl(49 96% 69%);
border-color: oklch(0.909 0.144 97);
}Tailwind CSS v4
@theme {
--color-xing-huang-yellow: #fce166;
--color-xing-huang-yellow-50: #fff7c7;
--color-xing-huang-yellow-100: #f3e9b2;
--color-xing-huang-yellow-200: #e3d68d;
--color-xing-huang-yellow-300: #cab95c;
--color-xing-huang-yellow-400: #b79e1d;
--color-xing-huang-yellow-500: #a28400;
--color-xing-huang-yellow-600: #897000;
--color-xing-huang-yellow-700: #6d5900;
--color-xing-huang-yellow-800: #524100;
--color-xing-huang-yellow-900: #392d00;
--color-xing-huang-yellow-950: #241900;
}SCSS
$xing-huang-yellow: #fce166;
$xing-huang-yellow-rgb: 252, 225, 102;
$xing-huang-yellow-light: mix(#fff, $xing-huang-yellow, 20%);
$xing-huang-yellow-dark: mix(#000, $xing-huang-yellow, 20%);
.element {
color: $xing-huang-yellow;
box-shadow: 0 0 0 2px rgba($xing-huang-yellow, 0.35);
}