命名颜色 · #6F5A48
Mexican Chocolate
Mexican Chocolate 即 #6F5A48：rgb(111 90 72)、hsl(28 21% 36%)、oklch(0.484 0.039 62.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Brown mean? → · Mexican Chocolate color name →
#6F5A48
oklch(0.484 0.039 62.3)
颜色转换
- HEX
- #6f5a48
- RGB
- rgb(111 90 72)
- HSL
- hsl(28 21% 36%)
- HWB
- hwb(28 28% 56%)
- OKLCH
- oklch(0.484 0.039 62.3)
- OKLab
- oklab(0.484 0.018 0.035)
- CIE Lab
- lab(40.01 6.77 13.84)
- LCH
- lch(40.01 15.41 63.9)
- CMYK
- cmyk(0% 19% 35% 56%)
浅色调 · 深色调 · 灰色调
浅色调
- 7D6959
- 8A796A
- 98887B
- A6998D
- B5A99F
- C3BAB2
- D2CBC5
- E1DCD8
- F0EDEB
深色调
- 604D3D
- 514133
- 423529
- 34291F
- 271E16
- 1A130D
- 0E0906
- 040302
- 010000
灰色调
- 715E4E
- 736253
- 746559
- 76695E
- 786D64
- 797169
- 7B756F
- 7D7875
- 7E7C7A
配色和谐
互补色 +180°
- 6F5A48
Mexican Chocolate
- 4B6273
≈ English Channel
类似色 -30° +30°
- 6F5A48
Mexican Chocolate
- 735751
≈ Brown Ridge
- 665E45
≈ Gator Tail
三角配色 +120° +240°
- 6F5A48
Mexican Chocolate
- 466660
≈ Grand Prix
- 635A71
≈ Head Over Heels
分裂互补色 +150° +210°
- 6F5A48
Mexican Chocolate
- 44656C
≈ Night Folly
- 575E75
≈ Nightly
四角配色 +90° +180° +270°
- 6F5A48
Mexican Chocolate
- 4E6554
≈ Pasture Green
- 4B6273
≈ English Channel
- 6C5768
≈ Dark Purple Grey
对比度与无障碍
Ag
AA白底
WCAG 6.49:1 · APCA Lc 82
Ag
Fail黑底
WCAG 3.23:1 · APCA Lc 20
最佳文字颜色: #FFFFFF
WCAG 6.49:1 (AA) · APCA Lc 82
Contrast pairs
代码片段
CSS
:root {
--mexican-chocolate: #6f5a48;
--mexican-chocolate-rgb: 111 90 72;
--mexican-chocolate-oklch: oklch(0.484 0.039 62.3);
}
.element {
color: var(--mexican-chocolate);
background-color: hsl(28 21% 36%);
border-color: oklch(0.484 0.039 62.3);
}Tailwind CSS v4
@theme {
--color-mexican-chocolate: #6f5a48;
--color-mexican-chocolate-50: #fdf3ea;
--color-mexican-chocolate-100: #f2e5db;
--color-mexican-chocolate-200: #e1d1c3;
--color-mexican-chocolate-300: #c6b4a3;
--color-mexican-chocolate-400: #b09a87;
--color-mexican-chocolate-500: #99816c;
--color-mexican-chocolate-600: #826d5c;
--color-mexican-chocolate-700: #685749;
--color-mexican-chocolate-800: #4d3f35;
--color-mexican-chocolate-900: #352c24;
--color-mexican-chocolate-950: #201913;
}SCSS
$mexican-chocolate: #6f5a48;
$mexican-chocolate-rgb: 111, 90, 72;
$mexican-chocolate-light: mix(#fff, $mexican-chocolate, 20%);
$mexican-chocolate-dark: mix(#000, $mexican-chocolate, 20%);
.element {
color: $mexican-chocolate;
box-shadow: 0 0 0 2px rgba($mexican-chocolate, 0.35);
}