Benannte Farbe · #CABAE0
Viking Diva
Viking Diva ist #CABAE0: rgb(202 186 224), hsl(265 38% 80%), oklch(0.814 0.055 304.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Viking Diva color name →
#CABAE0
oklch(0.814 0.055 304.3)
Farbumrechnungen
- HEX
- #cabae0
- RGB
- rgb(202 186 224)
- HSL
- hsl(265 38% 80%)
- HWB
- hwb(265 73% 12%)
- OKLCH
- oklch(0.814 0.055 304.3)
- OKLab
- oklab(0.814 0.031 -0.046)
- CIE Lab
- lab(77.79 11.21 -16.95)
- LCH
- lch(77.79 20.32 303.5)
- CMYK
- cmyk(10% 17% 0% 12%)
Tints · Shades · Tones
Tints
- CFC1E3
- D4C8E6
- DACEEA
- DFD5ED
- E4DCF0
- EAE3F3
- EFEAF6
- F4F1F9
- FAF8FC
Shades
- AFA1C3
- 9589A6
- 7C728A
- 645C70
- 4D4656
- 37323E
- 221E27
- 0F0D12
- 020202
Tones
- C2B4D6
- BBAECC
- B3A8C2
- ACA2B9
- A49DAF
- 9D97A5
- 96919C
- 8E8B93
- 878689
Farbharmonien
Komplementär +180°
- CABAE0
Viking Diva
- BAC9A2
≈ Gleam
Analog -30° +30°
- CABAE0
Viking Diva
- B7C0E7
≈ Spoiled Rotten
- DAB5D1
≈ Purple Poodle
Triadisch +120° +240°
- CABAE0
Viking Diva
- DCBB9E
≈ Holmes Cream
- 9ACFC6
≈ Opal Turquoise
Geteilt komplementär +150° +210°
- CABAE0
Viking Diva
- CEC29A
≈ Inviting Gesture
- A7CDB2
≈ Calculus
Tetradisch +90° +180° +270°
- CABAE0
Viking Diva
- E4B6AB
≈ Salmon Grey
- BAC9A2
≈ Gleam
- 9ACCD8
≈ Blue Stream
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.80:1 · APCA Lc 34
Ag
AAAAuf Schwarz
WCAG 11.61:1 · APCA Lc 69
Beste Textfarbe: #000000
WCAG 11.61:1 (AAA) · APCA Lc 69
Contrast pairs
Code-Snippets
CSS
:root {
--viking-diva: #cabae0;
--viking-diva-rgb: 202 186 224;
--viking-diva-oklch: oklch(0.814 0.055 304.3);
}
.element {
color: var(--viking-diva);
background-color: hsl(265 38% 80%);
border-color: oklch(0.814 0.055 304.3);
}Tailwind CSS v4
@theme {
--color-viking-diva: #cabae0;
--color-viking-diva-50: #f9f1ff;
--color-viking-diva-100: #ece3f7;
--color-viking-diva-200: #dacfe7;
--color-viking-diva-300: #beb1ce;
--color-viking-diva-400: #a597b9;
--color-viking-diva-500: #8e7da4;
--color-viking-diva-600: #786a8b;
--color-viking-diva-700: #60556f;
--color-viking-diva-800: #463e53;
--color-viking-diva-900: #302b3a;
--color-viking-diva-950: #1d1824;
}SCSS
$viking-diva: #cabae0;
$viking-diva-rgb: 202, 186, 224;
$viking-diva-light: mix(#fff, $viking-diva, 20%);
$viking-diva-dark: mix(#000, $viking-diva, 20%);
.element {
color: $viking-diva;
box-shadow: 0 0 0 2px rgba($viking-diva, 0.35);
}