最接近的命名颜色 · #7036C1
#7036C1
最接近的命名颜色: Purple Emperor
#7036C1（rgb(112 54 193)、hsl(265 56% 48%)、oklch(0.487 0.203 297.3)）最接近命名颜色 Purple Emperor。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#7036C1
oklch(0.487 0.203 297.3)
颜色转换
- HEX
- #7036c1
- RGB
- rgb(112 54 193)
- HSL
- hsl(265 56% 48%)
- HWB
- hwb(265 21% 24%)
- OKLCH
- oklch(0.487 0.203 297.3)
- OKLab
- oklab(0.487 0.093 -0.181)
- CIE Lab
- lab(36.9 47.41 -64.14)
- LCH
- lch(36.9 79.77 306.5)
- CMYK
- cmyk(42% 72% 0% 24%)
浅色调 · 深色调 · 灰色调
浅色调
- 7C4EC9
- 8963D0
- 9777D7
- A48BDE
- B39EE4
- C1B2EA
- D0C5F0
- E0D8F5
- EFEBFA
深色调
- 602EA7
- 51258F
- 431E77
- 35165F
- 270F49
- 1A0834
- 0E0320
- 04010E
- 010002
灰色调
- 7141BB
- 724BB6
- 7353B0
- 755BAA
- 7662A3
- 78699D
- 7A6F96
- 7C758F
- 7E7B88
配色和谐
互补色 +180°
- 7036C1
Purple Emperor
- 5B6700
≈ Mud Green
类似色 -30° +30°
- 7036C1
Purple Emperor
- 2E4ED0
≈ New Car
- 961E99
≈ Acai Juice
三角配色 +120° +240°
- 7036C1
Purple Emperor
- 904B00
≈ Parasite Brown
- 00705F
≈ Falcon Turquoise
分裂互补色 +150° +210°
- 7036C1
Purple Emperor
- 785B00
≈ Blackfire Earth
- 007428
≈ Clear Green
四角配色 +90° +180° +270°
- 7036C1
Purple Emperor
- B50010
≈ Red Lust
- 5B6700
≈ Mud Green
- 006C78
≈ Toadstool Teal
对比度与无障碍
Ag
AAA白底
WCAG 7.03:1 · APCA Lc 84
Ag
Fail黑底
WCAG 2.98:1 · APCA Lc 18
最佳文字颜色: #FFFFFF
WCAG 7.03:1 (AAA) · APCA Lc 84
Contrast pairs
代码片段
CSS
:root {
--purple-emperor: #7036c1;
--purple-emperor-rgb: 112 54 193;
--purple-emperor-oklch: oklch(0.487 0.203 297.3);
}
.element {
color: var(--purple-emperor);
background-color: hsl(265 56% 48%);
border-color: oklch(0.487 0.203 297.3);
}Tailwind CSS v4
@theme {
--color-purple-emperor: #7036c1;
--color-purple-emperor-50: #fde9ff;
--color-purple-emperor-100: #f1d9ff;
--color-purple-emperor-200: #e0c0ff;
--color-purple-emperor-300: #c79dff;
--color-purple-emperor-400: #ad7eff;
--color-purple-emperor-500: #985cf9;
--color-purple-emperor-600: #814fd2;
--color-purple-emperor-700: #673fa9;
--color-purple-emperor-800: #4a2e7f;
--color-purple-emperor-900: #331f5a;
--color-purple-emperor-950: #1f0d3d;
}SCSS
$purple-emperor: #7036c1;
$purple-emperor-rgb: 112, 54, 193;
$purple-emperor-light: mix(#fff, $purple-emperor, 20%);
$purple-emperor-dark: mix(#000, $purple-emperor, 20%);
.element {
color: $purple-emperor;
box-shadow: 0 0 0 2px rgba($purple-emperor, 0.35);
}