命名颜色 · #C09856
Amaretto Sour
Amaretto Sour 即 #C09856：rgb(192 152 86)、hsl(37 46% 55%)、oklch(0.703 0.097 78.7)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Amaretto Sour color name →
#C09856
oklch(0.703 0.097 78.7)
颜色转换
- HEX
- #c09856
- RGB
- rgb(192 152 86)
- HSL
- hsl(37 46% 55%)
- HWB
- hwb(37 34% 25%)
- OKLCH
- oklch(0.703 0.097 78.7)
- OKLab
- oklab(0.703 0.019 0.095)
- CIE Lab
- lab(65.59 9.69 40.31)
- LCH
- lch(65.59 41.46 76.5)
- CMYK
- cmyk(0% 21% 55% 25%)
浅色调 · 深色调 · 灰色调
浅色调
- C6A268
- CDAC79
- D3B78A
- D9C19B
- E0CBAB
- E6D5BC
- ECE0CD
- F3EADD
- F9F5EE
深色调
- A7844A
- 8E703E
- 765C32
- 5F4A27
- 49381C
- 342712
- 201708
- 0E0802
- 020100
灰色调
- BA965C
- B39461
- AD9166
- A68F6A
- A08D6E
- 998A72
- 938876
- 8D857A
- 86837D
配色和谐
互补色 +180°
- C09856
Amaretto Sour
- 7AA1DC
≈ Greek Sea
类似色 -30° +30°
- C09856
Amaretto Sour
- D18D69
≈ Cinnamon Brandy
- A4A45A
≈ Rickrack
三角配色 +120° +240°
- C09856
Amaretto Sour
- 47B2B6
≈ Crystalsong Blue
- B98CC6
≈ Lavender Blaze
分裂互补色 +150° +210°
- C09856
Amaretto Sour
- 57ABCF
≈ Frozen Wave
- 9D95D8
≈ Gorgeous Hydrangea
四角配色 +90° +180° +270°
- C09856
Amaretto Sour
- 5BB395
≈ Electra
- 7AA1DC
≈ Greek Sea
- CD86A9
≈ Moonlight Mauve
对比度与无障碍
Ag
Fail白底
WCAG 2.66:1 · APCA Lc 52
Ag
AAA黑底
WCAG 7.86:1 · APCA Lc 50
最佳文字颜色: #000000
WCAG 7.86:1 (AAA) · APCA Lc 50
Contrast pairs
代码片段
CSS
:root {
--amaretto-sour: #c09856;
--amaretto-sour-rgb: 192 152 86;
--amaretto-sour-oklch: oklch(0.703 0.097 78.7);
}
.element {
color: var(--amaretto-sour);
background-color: hsl(37 46% 55%);
border-color: oklch(0.703 0.097 78.7);
}Tailwind CSS v4
@theme {
--color-amaretto-sour: #c09856;
--color-amaretto-sour-50: #fff3d7;
--color-amaretto-sour-100: #f9e5c4;
--color-amaretto-sour-200: #ead1a6;
--color-amaretto-sour-300: #d1b37e;
--color-amaretto-sour-400: #be985a;
--color-amaretto-sour-500: #a97e31;
--color-amaretto-sour-600: #8f6b2b;
--color-amaretto-sour-700: #725522;
--color-amaretto-sour-800: #553d17;
--color-amaretto-sour-900: #3b2a0f;
--color-amaretto-sour-950: #251803;
}SCSS
$amaretto-sour: #c09856;
$amaretto-sour-rgb: 192, 152, 86;
$amaretto-sour-light: mix(#fff, $amaretto-sour, 20%);
$amaretto-sour-dark: mix(#000, $amaretto-sour, 20%);
.element {
color: $amaretto-sour;
box-shadow: 0 0 0 2px rgba($amaretto-sour, 0.35);
}