命名颜色 · #F9C89B
Orpiment Yellow
Orpiment Yellow 即 #F9C89B：rgb(249 200 155)、hsl(29 89% 79%)、oklch(0.865 0.081 64)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Orpiment Yellow color name →
#F9C89B
oklch(0.865 0.081 64)
颜色转换
- HEX
- #f9c89b
- RGB
- rgb(249 200 155)
- HSL
- hsl(29 89% 79%)
- HWB
- hwb(29 61% 2%)
- OKLCH
- oklch(0.865 0.081 64)
- OKLab
- oklab(0.865 0.036 0.073)
- CIE Lab
- lab(84.21 13.64 29.5)
- LCH
- lch(84.21 32.5 65.2)
- CMYK
- cmyk(0% 20% 38% 2%)
浅色调 · 深色调 · 灰色调
浅色调
- FACEA5
- FBD3AF
- FBD9B9
- FCDEC3
- FDE4CD
- FDE9D7
- FEEFE1
- FEF4EB
- FFFAF5
深色调
- D9AE86
- B99472
- 9A7B5E
- 7D634B
- 614C39
- 463628
- 2C2118
- 150F09
- 030201
灰色调
- ECC199
- E0B996
- D4B294
- C7AB91
- BBA48F
- AF9C8C
- A39589
- 978E86
- 8C8783
配色和谐
互补色 +180°
- F9C89B
Orpiment Yellow
- ABD9FF
≈ Malmö FF
类似色 -30° +30°
- F9C89B
Orpiment Yellow
- FFC2B3
≈ Tropical Peach
- E4D295
≈ Desert Wind
三角配色 +120° +240°
- F9C89B
Orpiment Yellow
- 94E5D9
≈ Sharbah Fizz
- DEC6FF
≈ Neon Boneyard
分裂互补色 +150° +210°
- F9C89B
Orpiment Yellow
- 92E1F3
≈ Photon Barrier
- C5D0FF
≈ Lavender Blue
四角配色 +90° +180° +270°
- F9C89B
Orpiment Yellow
- A9E3BB
≈ Bright Sea Green
- ABD9FF
≈ Malmö FF
- F4BFE9
≈ Lavender Soap
对比度与无障碍
Ag
Fail白底
WCAG 1.52:1 · APCA Lc 24
Ag
AAA黑底
WCAG 13.76:1 · APCA Lc 79
最佳文字颜色: #000000
WCAG 13.76:1 (AAA) · APCA Lc 79
Contrast pairs
代码片段
CSS
:root {
--orpiment-yellow: #f9c89b;
--orpiment-yellow-rgb: 249 200 155;
--orpiment-yellow-oklch: oklch(0.865 0.081 64);
}
.element {
color: var(--orpiment-yellow);
background-color: hsl(29 89% 79%);
border-color: oklch(0.865 0.081 64);
}Tailwind CSS v4
@theme {
--color-orpiment-yellow: #f9c89b;
--color-orpiment-yellow-50: #fff1dd;
--color-orpiment-yellow-100: #fbe3cc;
--color-orpiment-yellow-200: #edceb0;
--color-orpiment-yellow-300: #d5b08c;
--color-orpiment-yellow-400: #c1946b;
--color-orpiment-yellow-500: #ac7a4a;
--color-orpiment-yellow-600: #916840;
--color-orpiment-yellow-700: #745333;
--color-orpiment-yellow-800: #573c24;
--color-orpiment-yellow-900: #3d2918;
--color-orpiment-yellow-950: #261709;
}SCSS
$orpiment-yellow: #f9c89b;
$orpiment-yellow-rgb: 249, 200, 155;
$orpiment-yellow-light: mix(#fff, $orpiment-yellow, 20%);
$orpiment-yellow-dark: mix(#000, $orpiment-yellow, 20%);
.element {
color: $orpiment-yellow;
box-shadow: 0 0 0 2px rgba($orpiment-yellow, 0.35);
}