最接近的命名颜色 · #7D5443
#7D5443
最接近的命名颜色: Brownstone
#7D5443（rgb(125 84 67)、hsl(18 30% 38%)、oklch(0.486 0.061 43.3)）最接近命名颜色 Brownstone。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#7D5443
oklch(0.486 0.061 43.3)
颜色转换
- HEX
- #7d5443
- RGB
- rgb(125 84 67)
- HSL
- hsl(18 30% 38%)
- HWB
- hwb(18 26% 51%)
- OKLCH
- oklch(0.486 0.061 43.3)
- OKLab
- oklab(0.486 0.044 0.042)
- CIE Lab
- lab(40.01 15.99 17.22)
- LCH
- lch(40.01 23.5 47.1)
- CMYK
- cmyk(0% 33% 46% 51%)
浅色调 · 深色调 · 灰色调
浅色调
- 8A6454
- 977466
- A48478
- B0958A
- BDA69D
- CAB7B0
- D8C9C3
- E5DBD7
- F2EDEB
深色调
- 6C4839
- 5B3C2F
- 4B3126
- 3B261D
- 2C1B14
- 1E110C
- 110805
- 050201
- 010000
灰色调
- 7E5849
- 7E5D4F
- 7F6155
- 7F665B
- 806A61
- 806F68
- 80736E
- 807774
- 807C7A
配色和谐
互补色 +180°
- 7D5443
Brownstone
- 356779
≈ San Gabriel Blue
类似色 -30° +30°
- 7D5443
Brownstone
- 7E5155
≈ Deep Rhubarb
- 745A37
≈ Shingle Fawn
三角配色 +120° +240°
- 7D5443
Brownstone
- 3D6A56
≈ Toad King
- 5A5B81
≈ Deep Lavender
分裂互补色 +150° +210°
- 7D5443
Brownstone
- 306A69
≈ North Sea
- 466182
≈ Climate Control
四角配色 +90° +180° +270°
- 7D5443
Brownstone
- 516743
≈ Fern Grotto
- 356779
≈ San Gabriel Blue
- 6C5578
≈ Trixter
对比度与无障碍
Ag
AA白底
WCAG 6.51:1 · APCA Lc 82
Ag
Fail黑底
WCAG 3.22:1 · APCA Lc 20
最佳文字颜色: #FFFFFF
WCAG 6.51:1 (AA) · APCA Lc 82
Contrast pairs
代码片段
CSS
:root {
--brownstone: #7d5443;
--brownstone-rgb: 125 84 67;
--brownstone-oklch: oklch(0.486 0.061 43.3);
}
.element {
color: var(--brownstone);
background-color: hsl(18 30% 38%);
border-color: oklch(0.486 0.061 43.3);
}Tailwind CSS v4
@theme {
--color-brownstone: #7d5443;
--color-brownstone-50: #fff0e7;
--color-brownstone-100: #fae2d7;
--color-brownstone-200: #eccdbf;
--color-brownstone-300: #d3ae9e;
--color-brownstone-400: #be9382;
--color-brownstone-500: #a97965;
--color-brownstone-600: #8f6756;
--color-brownstone-700: #735245;
--color-brownstone-800: #553b32;
--color-brownstone-900: #3b2922;
--color-brownstone-950: #251711;
}SCSS
$brownstone: #7d5443;
$brownstone-rgb: 125, 84, 67;
$brownstone-light: mix(#fff, $brownstone, 20%);
$brownstone-dark: mix(#000, $brownstone, 20%);
.element {
color: $brownstone;
box-shadow: 0 0 0 2px rgba($brownstone, 0.35);
}