Benannte Farbe · #0343DF
Merchant Marine Blue
Merchant Marine Blue ist #0343DF: rgb(3 67 223), hsl(223 97% 44%), oklch(0.472 0.241 263.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Merchant Marine Blue color name →
#0343DF
oklch(0.472 0.241 263.3)
Farbumrechnungen
- HEX
- #0343df
- RGB
- rgb(3 67 223)
- HSL
- hsl(223 97% 44%)
- HWB
- hwb(223 1% 13%)
- OKLCH
- oklch(0.472 0.241 263.3)
- OKLab
- oklab(0.472 -0.028 -0.239)
- CIE Lab
- lab(35.04 34.8 -84.83)
- LCH
- lch(35.04 91.69 292.3)
- CMYK
- cmyk(99% 70% 0% 13%)
Tints · Shades · Tones
Tints
- 215BE4
- 3A70E9
- 5284EE
- 6996F2
- 82A8F6
- 9ABAF9
- B3CBFB
- CCDDFD
- E5EEFE
Shades
- 0239C2
- 022FA5
- 01268A
- 011D6F
- 001456
- 000C3D
- 000527
- 000112
- 000002
Tones
- 154ED6
- 2357CE
- 305EC5
- 3C65BC
- 486BB3
- 5370AA
- 5F75A0
- 6A7996
- 757D8B
Farbharmonien
Komplementär +180°
- 0343DF
Merchant Marine Blue
- 755500
≈ Pickled Grape Leaves
Analog -30° +30°
- 0343DF
Merchant Marine Blue
- 006389
≈ Reservoir
- 691ED2
≈ Crown Chakra
Triadisch +120° +240°
- 0343DF
Merchant Marine Blue
- AD0020
≈ Gaharā Lāl
- 00700C
≈ Bogey Green
Geteilt komplementär +150° +210°
- 0343DF
Merchant Marine Blue
- 8D4400
≈ Otterly Brown
- 5C6100
≈ Kirchner Green
Tetradisch +90° +180° +270°
- 0343DF
Merchant Marine Blue
- A40064
≈ Morbid Princess
- 755500
≈ Pickled Grape Leaves
- 006B57
≈ Chrysocolla Medium Green
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 7.31:1 · APCA Lc 84
Ag
FailAuf Schwarz
WCAG 2.87:1 · APCA Lc 18
Beste Textfarbe: #FFFFFF
WCAG 7.31:1 (AAA) · APCA Lc 84
Contrast pairs
Code-Snippets
CSS
:root {
--merchant-marine-blue: #0343df;
--merchant-marine-blue-rgb: 3 67 223;
--merchant-marine-blue-oklch: oklch(0.472 0.241 263.3);
}
.element {
color: var(--merchant-marine-blue);
background-color: hsl(223 97% 44%);
border-color: oklch(0.472 0.241 263.3);
}Tailwind CSS v4
@theme {
--color-merchant-marine-blue: #0343df;
--color-merchant-marine-blue-50: #d4f5ff;
--color-merchant-marine-blue-100: #c1e7ff;
--color-merchant-marine-blue-200: #a2d1ff;
--color-merchant-marine-blue-300: #7bb0ff;
--color-merchant-marine-blue-400: #4f93ff;
--color-merchant-marine-blue-500: #2872ff;
--color-merchant-marine-blue-600: #2361f4;
--color-merchant-marine-blue-700: #1b4ec4;
--color-merchant-marine-blue-800: #073a94;
--color-merchant-marine-blue-900: #052869;
--color-merchant-marine-blue-950: #001449;
}SCSS
$merchant-marine-blue: #0343df;
$merchant-marine-blue-rgb: 3, 67, 223;
$merchant-marine-blue-light: mix(#fff, $merchant-marine-blue, 20%);
$merchant-marine-blue-dark: mix(#000, $merchant-marine-blue, 20%);
.element {
color: $merchant-marine-blue;
box-shadow: 0 0 0 2px rgba($merchant-marine-blue, 0.35);
}