Benannte Farbe · #764663
Scintillating Violet
Scintillating Violet ist #764663: rgb(118 70 99), hsl(324 26% 37%), oklch(0.46 0.077 343.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Pink mean? → · Scintillating Violet color name →
#764663
oklch(0.46 0.077 343.5)
Farbumrechnungen
- HEX
- #764663
- RGB
- rgb(118 70 99)
- HSL
- hsl(324 26% 37%)
- HWB
- hwb(324 27% 54%)
- OKLCH
- oklch(0.46 0.077 343.5)
- OKLab
- oklab(0.46 0.074 -0.022)
- CIE Lab
- lab(36.32 24.4 -7.95)
- LCH
- lch(36.32 25.66 341.9)
- CMYK
- cmyk(0% 41% 16% 54%)
Tints · Shades · Tones
Tints
- 845771
- 916880
- 9F7A8F
- AC8C9E
- BA9FAE
- C8B1BE
- D6C4CE
- E3D8DE
- F1EBEE
Shades
- 663C55
- 563247
- 47283A
- 381E2E
- 291521
- 1C0D16
- 0F050B
- 050203
- 010000
Tones
- 784C66
- 795269
- 7A586C
- 7B5D6F
- 7C6371
- 7D6974
- 7E6F77
- 7F747A
- 807A7D
Farbharmonien
Komplementär +180°
- 764663
Scintillating Violet
- 27654C
≈ Brunswick
Analog -30° +30°
- 764663
Scintillating Violet
- 674B76
≈ Clary
- 7D454B
≈ Casandra
Triadisch +120° +240°
- 764663
Scintillating Violet
- 605A21
≈ Costa Del Sol
- 186178
≈ Jamaican Dream
Geteilt komplementär +150° +210°
- 764663
Scintillating Violet
- 466133
≈ Gemstone Green
- 076564
≈ Barbados Bay
Tetradisch +90° +180° +270°
- 764663
Scintillating Violet
- 725122
≈ Bark Brown
- 27654C
≈ Brunswick
- 385A82
≈ Pelagic
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 7.42:1 · APCA Lc 86
Ag
FailAuf Schwarz
WCAG 2.82:1 · APCA Lc 16
Beste Textfarbe: #FFFFFF
WCAG 7.42:1 (AAA) · APCA Lc 86
Contrast pairs
Code-Snippets
CSS
:root {
--scintillating-violet: #764663;
--scintillating-violet-rgb: 118 70 99;
--scintillating-violet-oklch: oklch(0.46 0.077 343.5);
}
.element {
color: var(--scintillating-violet);
background-color: hsl(324 26% 37%);
border-color: oklch(0.46 0.077 343.5);
}Tailwind CSS v4
@theme {
--color-scintillating-violet: #764663;
--color-scintillating-violet-50: #ffedfa;
--color-scintillating-violet-100: #fcdeed;
--color-scintillating-violet-200: #eec8db;
--color-scintillating-violet-300: #d5a8c0;
--color-scintillating-violet-400: #bf8daa;
--color-scintillating-violet-500: #aa7193;
--color-scintillating-violet-600: #90607c;
--color-scintillating-violet-700: #734d64;
--color-scintillating-violet-800: #55384a;
--color-scintillating-violet-900: #3b2633;
--color-scintillating-violet-950: #25141f;
}SCSS
$scintillating-violet: #764663;
$scintillating-violet-rgb: 118, 70, 99;
$scintillating-violet-light: mix(#fff, $scintillating-violet, 20%);
$scintillating-violet-dark: mix(#000, $scintillating-violet, 20%);
.element {
color: $scintillating-violet;
box-shadow: 0 0 0 2px rgba($scintillating-violet, 0.35);
}