Benannte Farbe · #66537F
Virtual Violet
Virtual Violet ist #66537F: rgb(102 83 127), hsl(266 21% 41%), oklch(0.479 0.073 303.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Virtual Violet color name →
#66537F
oklch(0.479 0.073 303.6)
Farbumrechnungen
- HEX
- #66537f
- RGB
- rgb(102 83 127)
- HSL
- hsl(266 21% 41%)
- HWB
- hwb(266 33% 50%)
- OKLCH
- oklch(0.479 0.073 303.6)
- OKLab
- oklab(0.479 0.04 -0.06)
- CIE Lab
- lab(38.63 15.28 -22.01)
- LCH
- lch(38.63 26.8 304.8)
- CMYK
- cmyk(20% 35% 0% 50%)
Tints · Shades · Tones
Tints
- 74638B
- 827398
- 9184A5
- A094B1
- AFA6BE
- BFB7CB
- CEC9D8
- DEDAE5
- EFEDF2
Shades
- 58476E
- 4A3B5D
- 3C304C
- 2F253C
- 231B2D
- 17111F
- 0C0811
- 040206
- 000001
Tones
- 69587F
- 6B5C80
- 6E6180
- 706580
- 736A80
- 756E80
- 787380
- 7B7780
- 7D7C80
Farbharmonien
Komplementär +180°
- 66537F
Virtual Violet
- 556435
≈ Interior Green
Analog -30° +30°
- 66537F
Virtual Violet
- 505A87
≈ Marlin
- 764E6F
≈ Brocade Violet
Triadisch +120° +240°
- 66537F
Virtual Violet
- 7A542F
≈ Arable Brown
- 216B62
≈ Galapagos Green
Geteilt komplementär +150° +210°
- 66537F
Virtual Violet
- 6B5C29
≈ Bean Green
- 3A694A
≈ Spirulina
Tetradisch +90° +180° +270°
- 66537F
Virtual Violet
- 814E42
≈ Beauty Patch
- 556435
≈ Interior Green
- 1F6876
≈ Persian Mosaic
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.75:1 · APCA Lc 83
Ag
FailAuf Schwarz
WCAG 3.10:1 · APCA Lc 19
Beste Textfarbe: #FFFFFF
WCAG 6.75:1 (AA) · APCA Lc 83
Contrast pairs
Code-Snippets
CSS
:root {
--virtual-violet: #66537f;
--virtual-violet-rgb: 102 83 127;
--virtual-violet-oklch: oklch(0.479 0.073 303.6);
}
.element {
color: var(--virtual-violet);
background-color: hsl(266 21% 41%);
border-color: oklch(0.479 0.073 303.6);
}Tailwind CSS v4
@theme {
--color-virtual-violet: #66537f;
--color-virtual-violet-50: #faf0ff;
--color-virtual-violet-100: #eee2fc;
--color-virtual-violet-200: #dccdee;
--color-virtual-violet-300: #c0aed6;
--color-virtual-violet-400: #a794c2;
--color-virtual-violet-500: #907aae;
--color-virtual-violet-600: #7a6893;
--color-virtual-violet-700: #625376;
--color-virtual-violet-800: #473c58;
--color-virtual-violet-900: #312a3d;
--color-virtual-violet-950: #1d1727;
}SCSS
$virtual-violet: #66537f;
$virtual-violet-rgb: 102, 83, 127;
$virtual-violet-light: mix(#fff, $virtual-violet, 20%);
$virtual-violet-dark: mix(#000, $virtual-violet, 20%);
.element {
color: $virtual-violet;
box-shadow: 0 0 0 2px rgba($virtual-violet, 0.35);
}