Nächste benannte Farbe · #003A99
#003A99
Nächste benannte Farbe: Smalt
#003A99 (rgb(0 58 153), hsl(217 100% 30%), oklch(0.385 0.164 260.8)) liegt am nächsten an der benannten Farbe Smalt. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#003A99
oklch(0.385 0.164 260.8)
Farbumrechnungen
- HEX
- #003a99
- RGB
- rgb(0 58 153)
- HSL
- hsl(217 100% 30%)
- HWB
- hwb(217 0% 40%)
- OKLCH
- oklch(0.385 0.164 260.8)
- OKLab
- oklab(0.385 -0.026 -0.162)
- CIE Lab
- lab(26.63 16.41 -57.44)
- LCH
- lch(26.63 59.74 285.9)
- CMYK
- cmyk(100% 62% 0% 40%)
Tints · Shades · Tones
Tints
- 1E4FA5
- 3763B0
- 4F76BB
- 678AC5
- 7F9DD0
- 98B0DA
- B1C4E3
- CAD7ED
- E4EBF6
Shades
- 003184
- 002870
- 00205D
- 00184A
- 001038
- 000927
- 000417
- 000108
- 000001
Tones
- 134398
- 214B96
- 2E5394
- 3A5A92
- 466190
- 52688D
- 5D6E8A
- 697487
- 747A84
Farbharmonien
Komplementär +180°
- 003A99
Smalt
- 593E00
≈ Pineapple
Analog -30° +30°
Triadisch +120° +240°
- 003A99
Smalt
- 83001C
≈ Oxblood
- 0F5300
≈ Greeeeeeen
Geteilt komplementär +150° +210°
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 10.16:1 · APCA Lc 93
Ag
FailAuf Schwarz
WCAG 2.06:1 · APCA Lc 10
Beste Textfarbe: #FFFFFF
WCAG 10.16:1 (AAA) · APCA Lc 93
Contrast pairs
Code-Snippets
CSS
:root {
--smalt: #003a99;
--smalt-rgb: 0 58 153;
--smalt-oklch: oklch(0.385 0.164 260.8);
}
.element {
color: var(--smalt);
background-color: hsl(217 100% 30%);
border-color: oklch(0.385 0.164 260.8);
}Tailwind CSS v4
@theme {
--color-smalt: #003a99;
--color-smalt-50: #dcf6ff;
--color-smalt-100: #cbe9ff;
--color-smalt-200: #afd4ff;
--color-smalt-300: #8ab6ff;
--color-smalt-400: #649cfe;
--color-smalt-500: #4281f1;
--color-smalt-600: #386ecb;
--color-smalt-700: #2d58a3;
--color-smalt-800: #1b417a;
--color-smalt-900: #122d56;
--color-smalt-950: #04193a;
}SCSS
$smalt: #003a99;
$smalt-rgb: 0, 58, 153;
$smalt-light: mix(#fff, $smalt, 20%);
$smalt-dark: mix(#000, $smalt, 20%);
.element {
color: $smalt;
box-shadow: 0 0 0 2px rgba($smalt, 0.35);
}