命名颜色 · #A69474
San Antonio Sage
San Antonio Sage 即 #A69474：rgb(166 148 116)、hsl(38 22% 55%)、oklch(0.674 0.05 81.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · San Antonio Sage color name →
#A69474
oklch(0.674 0.05 81.9)
颜色转换
- HEX
- #a69474
- RGB
- rgb(166 148 116)
- HSL
- hsl(38 22% 55%)
- HWB
- hwb(38 45% 35%)
- OKLCH
- oklch(0.674 0.05 81.9)
- OKLab
- oklab(0.674 0.007 0.049)
- CIE Lab
- lab(62.32 3.23 19.56)
- LCH
- lch(62.32 19.82 80.6)
- CMYK
- cmyk(0% 11% 30% 35%)
浅色调 · 深色调 · 灰色调
浅色调
- AF9E81
- B7A98F
- C0B39C
- C9BEAA
- D2C8B8
- DBD3C6
- E4DED4
- EDE9E2
- F6F4F1
深色调
- 908064
- 7A6D54
- 655A45
- 514837
- 3E3629
- 2B261B
- 1A160F
- 0A0805
- 010101
灰色调
- A29275
- 9E9077
- 9B8E78
- 978C79
- 938A7B
- 8F887C
- 8B867D
- 88847E
- 84827F
配色和谐
互补色 +180°
- A69474
San Antonio Sage
- 8697B6
≈ Denim Tradition
类似色 -30° +30°
- A69474
San Antonio Sage
- B08E7B
≈ Magnitude
- 979A77
≈ Lucky Day
三角配色 +120° +240°
- A69474
San Antonio Sage
- 72A0A3
≈ Delaware Blue Hen
- A58DA9
≈ Aged to Perfection
分裂互补色 +150° +210°
- A69474
San Antonio Sage
- 789CB0
≈ Frozen Lake
- 9791B3
≈ Extinct
四角配色 +90° +180° +270°
- A69474
San Antonio Sage
- 78A193
≈ Greyish Teal
- 8697B6
≈ Denim Tradition
- B08A9A
≈ Reserve
对比度与无障碍
Ag
Fail白底
WCAG 2.95:1 · APCA Lc 56
Ag
AAA黑底
WCAG 7.10:1 · APCA Lc 46
最佳文字颜色: #000000
WCAG 7.10:1 (AAA) · APCA Lc 46
Contrast pairs
代码片段
CSS
:root {
--san-antonio-sage: #a69474;
--san-antonio-sage-rgb: 166 148 116;
--san-antonio-sage-oklch: oklch(0.674 0.05 81.9);
}
.element {
color: var(--san-antonio-sage);
background-color: hsl(38 22% 55%);
border-color: oklch(0.674 0.05 81.9);
}Tailwind CSS v4
@theme {
--color-san-antonio-sage: #a69474;
--color-san-antonio-sage-50: #fcf4e6;
--color-san-antonio-sage-100: #f0e7d6;
--color-san-antonio-sage-200: #ded3bd;
--color-san-antonio-sage-300: #c4b69b;
--color-san-antonio-sage-400: #ad9c7e;
--color-san-antonio-sage-500: #978360;
--color-san-antonio-sage-600: #806f52;
--color-san-antonio-sage-700: #665941;
--color-san-antonio-sage-800: #4c412f;
--color-san-antonio-sage-900: #342d20;
--color-san-antonio-sage-950: #201a0f;
}SCSS
$san-antonio-sage: #a69474;
$san-antonio-sage-rgb: 166, 148, 116;
$san-antonio-sage-light: mix(#fff, $san-antonio-sage, 20%);
$san-antonio-sage-dark: mix(#000, $san-antonio-sage, 20%);
.element {
color: $san-antonio-sage;
box-shadow: 0 0 0 2px rgba($san-antonio-sage, 0.35);
}