最接近的命名颜色 · #B547B1
#B547B1
最接近的命名颜色: Mystifying Magenta
#B547B1(rgb(181 71 177)、hsl(302 44% 49%)、oklch(0.584 0.19 329.1))最接近命名颜色 Mystifying Magenta。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#B547B1
oklch(0.584 0.19 329.1)
颜色转换
- HEX
- #b547b1
- RGB
- rgb(181 71 177)
- HSL
- hsl(302 44% 49%)
- HWB
- hwb(302 28% 29%)
- OKLCH
- oklch(0.584 0.19 329.1)
- OKLab
- oklab(0.584 0.163 -0.097)
- CIE Lab
- lab(48.84 55 -35.04)
- LCH
- lch(48.84 65.22 327.5)
- CMYK
- cmyk(0% 61% 2% 29%)
浅色调 · 深色调 · 灰色调
浅色调
- BE5CB9
- C66FC1
- CE81C9
- D693D1
- DEA5D9
- E5B7E1
- ECC9E9
- F3DBF0
- F9EDF8
深色调
- 9D3D99
- 863283
- 6F286C
- 591F57
- 441642
- 300D2F
- 1D061C
- 0C020C
- 020001
灰色调
- B14FAC
- AC57A8
- A75DA3
- A2639E
- 9D6999
- 986E95
- 927390
- 8C778A
- 867C85
配色和谐
互补色 +180°
- B547B1
Mystifying Magenta
- 00953F
≈ Pixelated Grass
类似色 -30° +30°
- B547B1
Mystifying Magenta
- 8D59DA
≈ Gloomy Purple
- CD3A79
≈ Magentarama
三角配色 +120° +240°
- B547B1
Mystifying Magenta
- 987700
≈ Mesozoic Green
- 008B9C
≈ Atlantic Blue
分裂互补色 +150° +210°
- B547B1
Mystifying Magenta
- 738600
≈ Swamp Green
- 00907D
≈ Philips Green
四角配色 +90° +180° +270°
- B547B1
Mystifying Magenta
- B66300
≈ Umber
- 00953F
≈ Pixelated Grass
- 0084C0
≈ Ibiza Blue
对比度与无障碍
Ag
AA白底
WCAG 4.66:1 · APCA Lc 72
Ag
AA黑底
WCAG 4.50:1 · APCA Lc 30
最佳文字颜色: #FFFFFF
WCAG 4.66:1 (AA) · APCA Lc 72
Contrast pairs
代码片段
CSS
:root {
--mystifying-magenta: #b547b1;
--mystifying-magenta-rgb: 181 71 177;
--mystifying-magenta-oklch: oklch(0.584 0.19 329.1);
}
.element {
color: var(--mystifying-magenta);
background-color: hsl(302 44% 49%);
border-color: oklch(0.584 0.19 329.1);
}Tailwind CSS v4
@theme {
--color-mystifying-magenta: #b547b1;
--color-mystifying-magenta-50: #ffe2ff;
--color-mystifying-magenta-100: #ffd1ff;
--color-mystifying-magenta-200: #ffb6f9;
--color-mystifying-magenta-300: #ee91e4;
--color-mystifying-magenta-400: #d970d4;
--color-mystifying-magenta-500: #c64ac2;
--color-mystifying-magenta-600: #a740a4;
--color-mystifying-magenta-700: #863383;
--color-mystifying-magenta-800: #632464;
--color-mystifying-magenta-900: #451846;
--color-mystifying-magenta-950: #2d082d;
}SCSS
$mystifying-magenta: #b547b1;
$mystifying-magenta-rgb: 181, 71, 177;
$mystifying-magenta-light: mix(#fff, $mystifying-magenta, 20%);
$mystifying-magenta-dark: mix(#000, $mystifying-magenta, 20%);
.element {
color: $mystifying-magenta;
box-shadow: 0 0 0 2px rgba($mystifying-magenta, 0.35);
}