Benannte Farbe · #2D3145
Maritime Blue
Maritime Blue ist #2D3145: rgb(45 49 69), hsl(230 21% 22%), oklch(0.318 0.036 275.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Maritime Blue color name →
#2D3145
oklch(0.318 0.036 275.4)
Farbumrechnungen
- HEX
- #2d3145
- RGB
- rgb(45 49 69)
- HSL
- hsl(230 21% 22%)
- HWB
- hwb(230 18% 73%)
- OKLCH
- oklch(0.318 0.036 275.4)
- OKLab
- oklab(0.318 0.003 -0.036)
- CIE Lab
- lab(20.62 2.47 -13.18)
- LCH
- lch(20.62 13.41 280.6)
- CMYK
- cmyk(35% 29% 0% 73%)
Tints · Shades · Tones
Tints
- 3F4356
- 525667
- 656979
- 7A7D8B
- 8E919D
- A4A6B0
- BABCC3
- D1D2D7
- E8E8EB
Shades
- 26293B
- 1F2231
- 181A27
- 11131E
- 0B0C15
- 06060C
- 020305
- 010102
- 000000
Tones
- 35384B
- 3C4051
- 444856
- 4C4F5C
- 555762
- 5D5F68
- 66676E
- 6E6F74
- 77787A
Farbharmonien
Komplementär +180°
- 2D3145
Maritime Blue
- 38321D
≈ Pullman Green
Analog -30° +30°
- 2D3145
Maritime Blue
- 233444
≈ Blue Whale
- 372E41
≈ Oil Rush
Triadisch +120° +240°
- 2D3145
Maritime Blue
- 432C26
≈ Morocco Brown
- 23382A
≈ Palm Green
Geteilt komplementär +150° +210°
- 2D3145
Maritime Blue
- 3F2F1E
≈ Cola
- 2E3621
≈ Fuchsia Berries
Tetradisch +90° +180° +270°
- 2D3145
Maritime Blue
- 422B30
≈ Wenge Black
- 38321D
≈ Pullman Green
- 1B3835
≈ Kōrainando Green
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 12.82:1 · APCA Lc 99
Ag
FailAuf Schwarz
WCAG 1.63:1 · APCA Lc 0
Beste Textfarbe: #FFFFFF
WCAG 12.82:1 (AAA) · APCA Lc 99
Contrast pairs
Code-Snippets
CSS
:root {
--maritime-blue: #2d3145;
--maritime-blue-rgb: 45 49 69;
--maritime-blue-oklch: oklch(0.318 0.036 275.4);
}
.element {
color: var(--maritime-blue);
background-color: hsl(230 21% 22%);
border-color: oklch(0.318 0.036 275.4);
}Tailwind CSS v4
@theme {
--color-maritime-blue: #2d3145;
--color-maritime-blue-50: #f2f4ff;
--color-maritime-blue-100: #e4e7f4;
--color-maritime-blue-200: #d0d3e4;
--color-maritime-blue-300: #b2b6ca;
--color-maritime-blue-400: #989db4;
--color-maritime-blue-500: #7f859f;
--color-maritime-blue-600: #6b7086;
--color-maritime-blue-700: #565a6b;
--color-maritime-blue-800: #3e424f;
--color-maritime-blue-900: #2b2d37;
--color-maritime-blue-950: #181a22;
}SCSS
$maritime-blue: #2d3145;
$maritime-blue-rgb: 45, 49, 69;
$maritime-blue-light: mix(#fff, $maritime-blue, 20%);
$maritime-blue-dark: mix(#000, $maritime-blue, 20%);
.element {
color: $maritime-blue;
box-shadow: 0 0 0 2px rgba($maritime-blue, 0.35);
}