Couleur nommée la plus proche · #20487E
#20487E
Couleur nommée la plus proche: Maritime Outpost
#20487E (rgb(32 72 126), hsl(214 59% 31%), oklch(0.403 0.102 256.8)) est la plus proche de la couleur nommée Maritime Outpost. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#20487E
oklch(0.403 0.102 256.8)
Conversions de couleur
- HEX
- #20487e
- RGB
- rgb(32 72 126)
- HSL
- hsl(214 59% 31%)
- HWB
- hwb(214 13% 51%)
- OKLCH
- oklch(0.403 0.102 256.8)
- OKLab
- oklab(0.403 -0.023 -0.099)
- CIE Lab
- lab(29.99 1.11 -35.37)
- LCH
- lch(29.99 35.39 271.8)
- CMYK
- cmyk(75% 43% 0% 51%)
Teintes · Ombres · Tons
Teintes
- 35598B
- 4A6B98
- 5F7CA5
- 758EB2
- 8BA1BF
- A1B3CC
- B8C6D8
- CFD8E5
- E7ECF2
Ombres
- 1A3D6D
- 15335C
- 0F294C
- 0A1F3C
- 06162D
- 030D1F
- 010611
- 000205
- 000001
Tons
- 2A4E7F
- 34547F
- 3E5A80
- 485F80
- 516581
- 5A6A81
- 647081
- 6D7581
- 777B80
Harmonies de couleurs
Complémentaire +180°
- 20487E
Maritime Outpost
- 624100
≈ Notorious Neanderthal
Analogue -30° +30°
- 20487E
Maritime Outpost
- 005068
≈ Hanada Blue
- 463E7C
≈ Sage Violet
Triadique +120° +240°
- 20487E
Maritime Outpost
- 752D34
≈ Wine and Unwind
- 2C5416
≈ Navy Green
Complémentaire divisée +150° +210°
- 20487E
Maritime Outpost
- 73330D
≈ Beer Glazed Bacon
- 4E4B00
≈ Scorzonera Brown
Tétradique +90° +180° +270°
- 20487E
Maritime Outpost
- 6E2E53
≈ Bordeaux Red
- 624100
≈ Notorious Neanderthal
- 00563F
≈ Sacramento State Green
Contraste et accessibilité
Ag
AAASur blanc
WCAG 9.17:1 · APCA Lc 91
Ag
FailSur noir
WCAG 2.28:1 · APCA Lc 11
Meilleure couleur de texte: #FFFFFF
WCAG 9.17:1 (AAA) · APCA Lc 91
Contrast pairs
Extraits de code
CSS
:root {
--maritime-outpost: #20487e;
--maritime-outpost-rgb: 32 72 126;
--maritime-outpost-oklch: oklch(0.403 0.102 256.8);
}
.element {
color: var(--maritime-outpost);
background-color: hsl(214 59% 31%);
border-color: oklch(0.403 0.102 256.8);
}Tailwind CSS v4
@theme {
--color-maritime-outpost: #20487e;
--color-maritime-outpost-50: #e4f7ff;
--color-maritime-outpost-100: #d4e9ff;
--color-maritime-outpost-200: #bad6ff;
--color-maritime-outpost-300: #98b9ec;
--color-maritime-outpost-400: #77a0da;
--color-maritime-outpost-500: #5888c9;
--color-maritime-outpost-600: #4b73a9;
--color-maritime-outpost-700: #3c5c88;
--color-maritime-outpost-800: #294465;
--color-maritime-outpost-900: #1b2f47;
--color-maritime-outpost-950: #0c1b2e;
}SCSS
$maritime-outpost: #20487e;
$maritime-outpost-rgb: 32, 72, 126;
$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);
}