Dichtstbijzijnde benoemde kleur · #B547B1
#B547B1
Dichtstbijzijnde benoemde kleur: Mystifying Magenta
#B547B1 (rgb(181 71 177), hsl(302 44% 49%), oklch(0.584 0.19 329.1)) komt het dichtst bij de benoemde kleur Mystifying Magenta. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#B547B1
oklch(0.584 0.19 329.1)
Kleurconversies
- 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%)
Tinten · Schaduwen · Tonen
Tinten
- BE5CB9
- C66FC1
- CE81C9
- D693D1
- DEA5D9
- E5B7E1
- ECC9E9
- F3DBF0
- F9EDF8
Schaduwen
- 9D3D99
- 863283
- 6F286C
- 591F57
- 441642
- 300D2F
- 1D061C
- 0C020C
- 020001
Tonen
- B14FAC
- AC57A8
- A75DA3
- A2639E
- 9D6999
- 986E95
- 927390
- 8C778A
- 867C85
Kleurharmonieën
Complementair +180°
- B547B1
Mystifying Magenta
- 00953F
≈ Pixelated Grass
Analoog -30° +30°
- B547B1
Mystifying Magenta
- 8D59DA
≈ Gloomy Purple
- CD3A79
≈ Magentarama
Triadisch +120° +240°
- B547B1
Mystifying Magenta
- 987700
≈ Mesozoic Green
- 008B9C
≈ Atlantic Blue
Gesplitst complementair +150° +210°
- B547B1
Mystifying Magenta
- 738600
≈ Swamp Green
- 00907D
≈ Philips Green
Tetradisch +90° +180° +270°
- B547B1
Mystifying Magenta
- B66300
≈ Umber
- 00953F
≈ Pixelated Grass
- 0084C0
≈ Ibiza Blue
Contrast en toegankelijkheid
Ag
AAOp wit
WCAG 4.66:1 · APCA Lc 72
Ag
AAOp zwart
WCAG 4.50:1 · APCA Lc 30
Beste tekstkleur: #FFFFFF
WCAG 4.66:1 (AA) · APCA Lc 72
Contrast pairs
Codefragmenten
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);
}