最接近的命名颜色 · #871F74
#871F74
最接近的命名颜色: Noble Plum
#871F74（rgb(135 31 116)、hsl(311 63% 33%)、oklch(0.442 0.166 336.6)）最接近命名颜色 Noble Plum。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#871F74
oklch(0.442 0.166 336.6)
颜色转换
- HEX
- #871f74
- RGB
- rgb(135 31 116)
- HSL
- hsl(311 63% 33%)
- HWB
- hwb(311 12% 47%)
- OKLCH
- oklch(0.442 0.166 336.6)
- OKLab
- oklab(0.442 0.153 -0.066)
- CIE Lab
- lab(32.77 49.99 -23.77)
- LCH
- lch(32.77 55.36 334.6)
- CMYK
- cmyk(0% 77% 14% 47%)
浅色调 · 深色调 · 灰色调
浅色调
- 943A81
- A2508F
- AE669D
- BB7CAA
- C791B8
- D3A7C6
- DEBCD4
- E9D2E2
- F4E9F1
深色调
- 751964
- 631454
- 510F45
- 410A37
- 310629
- 21031B
- 13010F
- 060005
- 010001
灰色调
- 882D76
- 883977
- 884378
- 884D7A
- 88567B
- 875F7C
- 86677D
- 84707E
- 82787F
配色和谐
互补色 +180°
- 871F74
Noble Plum
- 00643A
≈ Fun Green
类似色 -30° +30°
- 871F74
Noble Plum
- 6B3099
≈ Rebecca Purple
- 971244
≈ Rum Riche
三角配色 +120° +240°
- 871F74
Noble Plum
- 625200
≈ Olive Brown
- 005D6F
≈ Brave New Teal
分裂互补色 +150° +210°
- 871F74
Noble Plum
- 425D00
≈ Lustrian Undergrowth
- 00605A
≈ Mosque
四角配色 +90° +180° +270°
- 871F74
Noble Plum
- 764600
≈ Flat Brown
- 00643A
≈ Fun Green
- 00568E
≈ Bandana
对比度与无障碍
Ag
AAA白底
WCAG 8.47:1 · APCA Lc 88
Ag
Fail黑底
WCAG 2.47:1 · APCA Lc 14
最佳文字颜色: #FFFFFF
WCAG 8.47:1 (AAA) · APCA Lc 88
Contrast pairs
代码片段
CSS
:root {
--noble-plum: #871f74;
--noble-plum-rgb: 135 31 116;
--noble-plum-oklch: oklch(0.442 0.166 336.6);
}
.element {
color: var(--noble-plum);
background-color: hsl(311 63% 33%);
border-color: oklch(0.442 0.166 336.6);
}Tailwind CSS v4
@theme {
--color-noble-plum: #871f74;
--color-noble-plum-50: #ffe3ff;
--color-noble-plum-100: #ffd3fb;
--color-noble-plum-200: #ffb9ec;
--color-noble-plum-300: #ef95d4;
--color-noble-plum-400: #da74c2;
--color-noble-plum-500: #c752ae;
--color-noble-plum-600: #a84693;
--color-noble-plum-700: #873876;
--color-noble-plum-800: #632859;
--color-noble-plum-900: #461b3e;
--color-noble-plum-950: #2d0a27;
}SCSS
$noble-plum: #871f74;
$noble-plum-rgb: 135, 31, 116;
$noble-plum-light: mix(#fff, $noble-plum, 20%);
$noble-plum-dark: mix(#000, $noble-plum, 20%);
.element {
color: $noble-plum;
box-shadow: 0 0 0 2px rgba($noble-plum, 0.35);
}