Benannte Farbe · #773399
Skeletor’s Cape
Skeletor’s Cape ist #773399: rgb(119 51 153), hsl(280 50% 40%), oklch(0.462 0.165 312.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Skeletor’s Cape color name →
#773399
oklch(0.462 0.165 312.4)
Farbumrechnungen
- HEX
- #773399
- RGB
- rgb(119 51 153)
- HSL
- hsl(280 50% 40%)
- HWB
- hwb(280 20% 40%)
- OKLCH
- oklch(0.462 0.165 312.4)
- OKLab
- oklab(0.462 0.111 -0.122)
- CIE Lab
- lab(34.82 42.97 -43.64)
- LCH
- lch(34.82 61.24 314.6)
- CMYK
- cmyk(22% 67% 0% 40%)
Tints · Shades · Tones
Tints
- 8449A4
- 915DAF
- 9F71B9
- AC85C4
- BA99CE
- C7ADD8
- D5C1E2
- E3D6EC
- F1EAF5
Shades
- 672B84
- 572370
- 471C5D
- 38144A
- 2A0D38
- 1C0727
- 100317
- 050108
- 010001
Tones
- 783D97
- 794695
- 7A4E93
- 7B5691
- 7C5E8F
- 7D658C
- 7E6C89
- 7F7386
- 7F7983
Farbharmonien
Komplementär +180°
- 773399
Skeletor’s Cape
- 3B6600
≈ Tatzelwurm Green
Analog -30° +30°
- 773399
Skeletor’s Cape
- 4F44B0
≈ Megadrive Screen
- 912471
≈ Beetiful Magenta
Triadisch +120° +240°
- 773399
Skeletor’s Cape
- 7A4E00
≈ Lucky Brown
- 006664
≈ Peacock Pride
Geteilt komplementär +150° +210°
- 773399
Skeletor’s Cape
- 635A00
≈ Brussels Sprout Green
- 006947
≈ Greens
Tetradisch +90° +180° +270°
- 773399
Skeletor’s Cape
- 943600
≈ Citrine Brown
- 3B6600
≈ Tatzelwurm Green
- 00627B
≈ Jamaican Dream
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 7.72:1 · APCA Lc 86
Ag
FailAuf Schwarz
WCAG 2.71:1 · APCA Lc 16
Beste Textfarbe: #FFFFFF
WCAG 7.72:1 (AAA) · APCA Lc 86
Contrast pairs
Code-Snippets
CSS
:root {
--skeletor-s-cape: #773399;
--skeletor-s-cape-rgb: 119 51 153;
--skeletor-s-cape-oklch: oklch(0.462 0.165 312.4);
}
.element {
color: var(--skeletor-s-cape);
background-color: hsl(280 50% 40%);
border-color: oklch(0.462 0.165 312.4);
}Tailwind CSS v4
@theme {
--color-skeletor-s-cape: #773399;
--color-skeletor-s-cape-50: #ffe8ff;
--color-skeletor-s-cape-100: #fdd8ff;
--color-skeletor-s-cape-200: #efbfff;
--color-skeletor-s-cape-300: #d69df2;
--color-skeletor-s-cape-400: #bf7fe4;
--color-skeletor-s-cape-500: #ab5fd3;
--color-skeletor-s-cape-600: #9051b2;
--color-skeletor-s-cape-700: #74408f;
--color-skeletor-s-cape-800: #542f6c;
--color-skeletor-s-cape-900: #3b204c;
--color-skeletor-s-cape-950: #250f32;
}SCSS
$skeletor-s-cape: #773399;
$skeletor-s-cape-rgb: 119, 51, 153;
$skeletor-s-cape-light: mix(#fff, $skeletor-s-cape, 20%);
$skeletor-s-cape-dark: mix(#000, $skeletor-s-cape, 20%);
.element {
color: $skeletor-s-cape;
box-shadow: 0 0 0 2px rgba($skeletor-s-cape, 0.35);
}