最接近的命名颜色 · #7D5393
#7D5393
最接近的命名颜色: Ninja Princess
#7D5393（rgb(125 83 147)、hsl(279 28% 45%)、oklch(0.514 0.108 313.2)）最接近命名颜色 Ninja Princess。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#7D5393
oklch(0.514 0.108 313.2)
颜色转换
- HEX
- #7d5393
- RGB
- rgb(125 83 147)
- HSL
- hsl(279 28% 45%)
- HWB
- hwb(279 33% 42%)
- OKLCH
- oklch(0.514 0.108 313.2)
- OKLab
- oklab(0.514 0.074 -0.079)
- CIE Lab
- lab(42.05 27.08 -28.56)
- LCH
- lch(42.05 39.36 313.5)
- CMYK
- cmyk(15% 44% 0% 42%)
浅色调 · 深色调 · 灰色调
浅色调
- 89639E
- 9674A9
- A385B3
- B096BE
- BCA7C9
- CAB8D4
- D7C9DF
- E4DBE9
- F1EDF4
深色调
- 6C477F
- 5B3B6C
- 4B3059
- 3B2547
- 2C1B36
- 1E1125
- 110816
- 050208
- 010001
灰色调
- 7D5891
- 7E5D90
- 7E618E
- 7F668C
- 7F6A8A
- 7F6F89
- 7F7387
- 807884
- 807C82
配色和谐
互补色 +180°
- 7D5393
Ninja Princess
- 4D742E
≈ Loren Forest
类似色 -30° +30°
- 7D5393
Ninja Princess
- 605DA3
≈ Giant Onion
- 914C77
≈ Sugar Plum
三角配色 +120° +240°
- 7D5393
Ninja Princess
- 8C5C03
≈ Rat Brown
- 007775
≈ Prismarine
分裂互补色 +150° +210°
- 7D5393
Ninja Princess
- 736900
≈ Brown Green
- 097A55
≈ Poplar Forest
四角配色 +90° +180° +270°
- 7D5393
Ninja Princess
- 9A5030
≈ Hawaiian Coconut
- 4D742E
≈ Loren Forest
- 00738F
≈ Ocean Mirage
对比度与无障碍
Ag
AA白底
WCAG 5.94:1 · APCA Lc 80
Ag
Fail黑底
WCAG 3.53:1 · APCA Lc 22
最佳文字颜色: #FFFFFF
WCAG 5.94:1 (AA) · APCA Lc 80
Contrast pairs
代码片段
CSS
:root {
--ninja-princess: #7d5393;
--ninja-princess-rgb: 125 83 147;
--ninja-princess-oklch: oklch(0.514 0.108 313.2);
}
.element {
color: var(--ninja-princess);
background-color: hsl(279 28% 45%);
border-color: oklch(0.514 0.108 313.2);
}Tailwind CSS v4
@theme {
--color-ninja-princess: #7d5393;
--color-ninja-princess-50: #ffecff;
--color-ninja-princess-100: #f6deff;
--color-ninja-princess-200: #e6c7f5;
--color-ninja-princess-300: #cda7de;
--color-ninja-princess-400: #b58bcc;
--color-ninja-princess-500: #9f6fb9;
--color-ninja-princess-600: #875f9c;
--color-ninja-princess-700: #6c4b7d;
--color-ninja-princess-800: #4e375e;
--color-ninja-princess-900: #372642;
--color-ninja-princess-950: #21142a;
}SCSS
$ninja-princess: #7d5393;
$ninja-princess-rgb: 125, 83, 147;
$ninja-princess-light: mix(#fff, $ninja-princess, 20%);
$ninja-princess-dark: mix(#000, $ninja-princess, 20%);
.element {
color: $ninja-princess;
box-shadow: 0 0 0 2px rgba($ninja-princess, 0.35);
}