Benannte Farbe · #1E4581
Maritime Outpost
Maritime Outpost ist #1E4581: rgb(30 69 129), hsl(216 62% 31%), oklch(0.397 0.11 258.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Maritime Outpost color name →
#1E4581
oklch(0.397 0.11 258.9)
Farbumrechnungen
- HEX
- #1e4581
- RGB
- rgb(30 69 129)
- HSL
- hsl(216 62% 31%)
- HWB
- hwb(216 12% 49%)
- OKLCH
- oklch(0.397 0.11 258.9)
- OKLab
- oklab(0.397 -0.021 -0.108)
- CIE Lab
- lab(29.12 3.63 -38.62)
- LCH
- lch(29.12 38.79 275.4)
- CMYK
- cmyk(77% 47% 0% 49%)
Tints · Shades · Tones
Tints
- 33578E
- 48699B
- 5E7BA7
- 738DB4
- 899FC1
- A0B2CD
- B7C5DA
- CFD8E6
- E7EBF3
Shades
- 193B6F
- 13315E
- 0E274E
- 091E3E
- 05152E
- 030C1F
- 010512
- 000206
- 000001
Tones
- 294B82
- 335282
- 3C5882
- 465E82
- 506482
- 596982
- 636F82
- 6D7582
- 767A81
Farbharmonien
Komplementär +180°
- 1E4581
Maritime Outpost
- 5E4000
≈ Hippogriff Brown
Analog -30° +30°
- 1E4581
Maritime Outpost
- 004E68
≈ Work Blue
- 463A7D
≈ Sage Violet
Triadisch +120° +240°
- 1E4581
Maritime Outpost
- 77282E
≈ Chocolate Bhut Jolokia
- 235411
≈ Patch of Land
Geteilt komplementär +150° +210°
- 1E4581
Maritime Outpost
- 723100
≈ Bay Brown
- 4B4A00
≈ No Emissions Green
Tetradisch +90° +180° +270°
- 1E4581
Maritime Outpost
- 702950
≈ Ebizome Purple
- 5E4000
≈ Hippogriff Brown
- 00543F
≈ Sacramento State Green
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 9.44:1 · APCA Lc 92
Ag
FailAuf Schwarz
WCAG 2.22:1 · APCA Lc 11
Beste Textfarbe: #FFFFFF
WCAG 9.44:1 (AAA) · APCA Lc 92
Contrast pairs
Code-Snippets
CSS
:root {
--maritime-outpost: #1e4581;
--maritime-outpost-rgb: 30 69 129;
--maritime-outpost-oklch: oklch(0.397 0.11 258.9);
}
.element {
color: var(--maritime-outpost);
background-color: hsl(216 62% 31%);
border-color: oklch(0.397 0.11 258.9);
}Tailwind CSS v4
@theme {
--color-maritime-outpost: #1e4581;
--color-maritime-outpost-50: #e4f6ff;
--color-maritime-outpost-100: #d3e9ff;
--color-maritime-outpost-200: #bad5ff;
--color-maritime-outpost-300: #97b8f0;
--color-maritime-outpost-400: #76a0e0;
--color-maritime-outpost-500: #5886cf;
--color-maritime-outpost-600: #4b72ae;
--color-maritime-outpost-700: #3b5b8c;
--color-maritime-outpost-800: #284368;
--color-maritime-outpost-900: #1b2e49;
--color-maritime-outpost-950: #0b1b30;
}SCSS
$maritime-outpost: #1e4581;
$maritime-outpost-rgb: 30, 69, 129;
$maritime-outpost-light: mix(#fff, $maritime-outpost, 20%);
$maritime-outpost-dark: mix(#000, $maritime-outpost, 20%);
.element {
color: $maritime-outpost;
box-shadow: 0 0 0 2px rgba($maritime-outpost, 0.35);
}