命名颜色 · #BA7F38
Cut the Mustard
Cut the Mustard 即 #BA7F38:rgb(186 127 56)、hsl(33 54% 47%)、oklch(0.643 0.113 68.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Cut the Mustard color name →
#BA7F38
oklch(0.643 0.113 68.2)
颜色转换
- HEX
- #ba7f38
- RGB
- rgb(186 127 56)
- HSL
- hsl(33 54% 47%)
- HWB
- hwb(33 22% 27%)
- OKLCH
- oklch(0.643 0.113 68.2)
- OKLab
- oklab(0.643 0.042 0.105)
- CIE Lab
- lab(58.4 18.7 46.84)
- LCH
- lch(58.4 50.44 68.2)
- CMYK
- cmyk(0% 32% 70% 27%)
浅色调 · 深色调 · 灰色调
浅色调
- C18C4F
- C99863
- D0A577
- D7B28B
- DEBF9E
- E5CBB1
- EBD8C4
- F2E5D8
- F9F2EB
深色调
- A16E2F
- 895D27
- 724C1F
- 5C3C17
- 462D0F
- 321F08
- 1E1104
- 0D0601
- 020100
灰色调
- B48042
- AF804B
- A98053
- A3815B
- 9E8162
- 988168
- 92816F
- 8C8175
- 86807A
配色和谐
互补色 +180°
- BA7F38
Cut the Mustard
- 5192CF
≈ Delphinium Corsage
类似色 -30° +30°
- BA7F38
Cut the Mustard
- C77359
≈ Spanish Peanut
- 9F8D30
≈ Banana Leaf
三角配色 +120° +240°
- BA7F38
Cut the Mustard
- 00A39A
≈ Grecian Isle
- A07AC2
≈ Wisteria
分裂互补色 +150° +210°
- BA7F38
Cut the Mustard
- 119DBB
≈ Ahriman Blue
- 7E85D1
≈ Tanzine
四角配色 +90° +180° +270°
- BA7F38
Cut the Mustard
- 47A273
≈ Tropical Tone
- 5192CF
≈ Delphinium Corsage
- B971A5
≈ Eccentric Magenta
对比度与无障碍
Ag
Fail白底
WCAG 3.39:1 · APCA Lc 61
Ag
AA黑底
WCAG 6.18:1 · APCA Lc 40
最佳文字颜色: #000000
WCAG 6.18:1 (AA) · APCA Lc 40
Contrast pairs
代码片段
CSS
:root {
--cut-the-mustard: #ba7f38;
--cut-the-mustard-rgb: 186 127 56;
--cut-the-mustard-oklch: oklch(0.643 0.113 68.2);
}
.element {
color: var(--cut-the-mustard);
background-color: hsl(33 54% 47%);
border-color: oklch(0.643 0.113 68.2);
}Tailwind CSS v4
@theme {
--color-cut-the-mustard: #ba7f38;
--color-cut-the-mustard-50: #fff0d3;
--color-cut-the-mustard-100: #ffe2c0;
--color-cut-the-mustard-200: #f4cda0;
--color-cut-the-mustard-300: #ddae76;
--color-cut-the-mustard-400: #ca9150;
--color-cut-the-mustard-500: #b67620;
--color-cut-the-mustard-600: #9a641e;
--color-cut-the-mustard-700: #7c5018;
--color-cut-the-mustard-800: #5c3910;
--color-cut-the-mustard-900: #41270a;
--color-cut-the-mustard-950: #291500;
}SCSS
$cut-the-mustard: #ba7f38;
$cut-the-mustard-rgb: 186, 127, 56;
$cut-the-mustard-light: mix(#fff, $cut-the-mustard, 20%);
$cut-the-mustard-dark: mix(#000, $cut-the-mustard, 20%);
.element {
color: $cut-the-mustard;
box-shadow: 0 0 0 2px rgba($cut-the-mustard, 0.35);
}