Benannte Farbe · #2E4182
Official Violet
Official Violet ist #2E4182: rgb(46 65 130), hsl(226 48% 35%), oklch(0.396 0.112 268.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Official Violet color name →
#2E4182
oklch(0.396 0.112 268.6)
Farbumrechnungen
- HEX
- #2e4182
- RGB
- rgb(46 65 130)
- HSL
- hsl(226 48% 35%)
- HWB
- hwb(226 18% 49%)
- OKLCH
- oklch(0.396 0.112 268.6)
- OKLab
- oklab(0.396 -0.003 -0.112)
- CIE Lab
- lab(28.77 9.67 -39.74)
- LCH
- lch(28.77 40.9 283.7)
- CMYK
- cmyk(65% 50% 0% 49%)
Tints · Shades · Tones
Tints
- 40538F
- 53659C
- 6678A8
- 7A8AB5
- 8F9DC1
- A5B0CE
- BBC3DA
- D1D7E7
- E8EBF3
Shades
- 273770
- 1F2E5F
- 18254E
- 121C3E
- 0B132F
- 060B20
- 020512
- 010106
- 000001
Tones
- 354882
- 3D4F83
- 455583
- 4D5B83
- 556283
- 5E6883
- 666E82
- 6F7482
- 777A81
Farbharmonien
Komplementär +180°
- 2E4182
Official Violet
- 584400
≈ Sugarloaf Brown
Analog -30° +30°
- 2E4182
Official Violet
- 004C71
≈ Pompeii Blue
- 4F367A
≈ Prism Violet
Triadisch +120° +240°
- 2E4182
Official Violet
- 772921
≈ Hihada Brown
- 025621
≈ O Tannenbaum
Geteilt komplementär +150° +210°
- 2E4182
Official Violet
- 6B3700
≈ Bestial Brown
- 424D00
≈ No Emissions Green
Tetradisch +90° +180° +270°
- 2E4182
Official Violet
- 732746
≈ Palace Red
- 584400
≈ Sugarloaf Brown
- 005347
≈ Breathe Deeply
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 9.56:1 · APCA Lc 92
Ag
FailAuf Schwarz
WCAG 2.19:1 · APCA Lc 10
Beste Textfarbe: #FFFFFF
WCAG 9.56:1 (AAA) · APCA Lc 92
Contrast pairs
Code-Snippets
CSS
:root {
--official-violet: #2e4182;
--official-violet-rgb: 46 65 130;
--official-violet-oklch: oklch(0.396 0.112 268.6);
}
.element {
color: var(--official-violet);
background-color: hsl(226 48% 35%);
border-color: oklch(0.396 0.112 268.6);
}Tailwind CSS v4
@theme {
--color-official-violet: #2e4182;
--color-official-violet-50: #e9f4ff;
--color-official-violet-100: #dae7ff;
--color-official-violet-200: #c2d3ff;
--color-official-violet-300: #a2b5f1;
--color-official-violet-400: #839be1;
--color-official-violet-500: #6782d0;
--color-official-violet-600: #586eb0;
--color-official-violet-700: #46588d;
--color-official-violet-800: #314169;
--color-official-violet-900: #212d4a;
--color-official-violet-950: #101931;
}SCSS
$official-violet: #2e4182;
$official-violet-rgb: 46, 65, 130;
$official-violet-light: mix(#fff, $official-violet, 20%);
$official-violet-dark: mix(#000, $official-violet, 20%);
.element {
color: $official-violet;
box-shadow: 0 0 0 2px rgba($official-violet, 0.35);
}