命名颜色 · #7C0087
Aunt Violet
Aunt Violet 即 #7C0087：rgb(124 0 135)、hsl(295 100% 26%)、oklch(0.419 0.197 324)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Purple mean? → · Aunt Violet color name →
#7C0087
oklch(0.419 0.197 324)
颜色转换
- HEX
- #7c0087
- RGB
- rgb(124 0 135)
- HSL
- hsl(295 100% 26%)
- HWB
- hwb(295 0% 47%)
- OKLCH
- oklch(0.419 0.197 324)
- OKLab
- oklab(0.419 0.159 -0.116)
- CIE Lab
- lab(29.29 56.16 -41.36)
- LCH
- lch(29.29 69.75 323.6)
- CMYK
- cmyk(8% 100% 0% 47%)
浅色调 · 深色调 · 灰色调
浅色调
- 8A2C94
- 9847A0
- A65FAC
- B376B8
- C08CC4
- CDA3D0
- DAB9DC
- E6D0E8
- F3E8F3
深色调
- 6B0075
- 5A0063
- 4A0051
- 3B0041
- 2C0031
- 1E0021
- 110013
- 050006
- 010001
灰色调
- 7E1E87
- 7F2E87
- 803B87
- 814786
- 815186
- 825B85
- 826584
- 816E83
- 817782
配色和谐
互补色 +180°
- 7C0087
Aunt Violet
- 005E0E
≈ Evergreen Shade
类似色 -30° +30°
- 7C0087
Aunt Violet
- 5822AA
≈ Royalty
- 8C0053
≈ Reddish Purple
三角配色 +120° +240°
- 7C0087
Aunt Violet
- 634800
≈ Mud Brown
- 00585F
≈ Entrapment
分裂互补色 +150° +210°
- 7C0087
Aunt Violet
- 4D5200
≈ Verdun Green
- 005B49
≈ Forest Shadows
四角配色 +90° +180° +270°
- 7C0087
Aunt Violet
- 773900
≈ Red Beech
- 005E0E
≈ Evergreen Shade
- 005475
≈ World Peace
对比度与无障碍
Ag
AAA白底
WCAG 9.51:1 · APCA Lc 90
Ag
Fail黑底
WCAG 2.20:1 · APCA Lc 12
最佳文字颜色: #FFFFFF
WCAG 9.51:1 (AAA) · APCA Lc 90
Contrast pairs
代码片段
CSS
:root {
--aunt-violet: #7c0087;
--aunt-violet-rgb: 124 0 135;
--aunt-violet-oklch: oklch(0.419 0.197 324);
}
.element {
color: var(--aunt-violet);
background-color: hsl(295 100% 26%);
border-color: oklch(0.419 0.197 324);
}Tailwind CSS v4
@theme {
--color-aunt-violet: #7c0087;
--color-aunt-violet-50: #ffe2ff;
--color-aunt-violet-100: #ffd1ff;
--color-aunt-violet-200: #ffb6ff;
--color-aunt-violet-300: #ea91ed;
--color-aunt-violet-400: #d570df;
--color-aunt-violet-500: #c24ace;
--color-aunt-violet-600: #a440ae;
--color-aunt-violet-700: #83338b;
--color-aunt-violet-800: #60246a;
--color-aunt-violet-900: #44184a;
--color-aunt-violet-950: #2b0831;
}SCSS
$aunt-violet: #7c0087;
$aunt-violet-rgb: 124, 0, 135;
$aunt-violet-light: mix(#fff, $aunt-violet, 20%);
$aunt-violet-dark: mix(#000, $aunt-violet, 20%);
.element {
color: $aunt-violet;
box-shadow: 0 0 0 2px rgba($aunt-violet, 0.35);
}