Couleur nommée la plus proche · #00377C
#00377C
Couleur nommée la plus proche: Atlantic Navy
#00377C (rgb(0 55 124), hsl(213 100% 24%), oklch(0.352 0.129 257.7)) est la plus proche de la couleur nommée Atlantic Navy. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#00377C
oklch(0.352 0.129 257.7)
Conversions de couleur
- HEX
- #00377c
- RGB
- rgb(0 55 124)
- HSL
- hsl(213 100% 24%)
- HWB
- hwb(213 0% 51%)
- OKLCH
- oklch(0.352 0.129 257.7)
- OKLab
- oklab(0.352 -0.027 -0.126)
- CIE Lab
- lab(23.54 7.63 -44.53)
- LCH
- lch(23.54 45.18 279.7)
- CMYK
- cmyk(100% 56% 0% 51%)
Teintes · Ombres · Tons
Teintes
- 1E4B8A
- 375E97
- 4E71A5
- 6685B2
- 7E99BF
- 97ADCC
- B0C1D9
- CAD5E6
- E4EAF2
Ombres
- 002E6B
- 00265A
- 001E4A
- 00163B
- 000F2C
- 00081E
- 000311
- 000105
- 000001
Tons
- 123F7D
- 21477E
- 2D4F7F
- 3A5680
- 455D81
- 516581
- 5D6C81
- 687281
- 747981
Harmonies de couleurs
Complémentaire +180°
- 00377C
Atlantic Navy
- 503500
≈ Eyelash Camel
Analogue -30° +30°
- 00377C
Atlantic Navy
- 004157
≈ Maniac Mansion
- 3A2979
≈ Clear Purple
Triadique +120° +240°
- 00377C
Atlantic Navy
- 6F0E20
≈ Surya Red
- 194700
≈ Dark Fern
Complémentaire divisée +150° +210°
- 00377C
Atlantic Navy
- 612700
≈ Hot Fudge
- 3F3D00
≈ Dark Olive
Tétradique +90° +180° +270°
- 00377C
Atlantic Navy
- 671247
≈ Spanish Purple
- 503500
≈ Eyelash Camel
- 004633
≈ UP Forest Green
Contraste et accessibilité
Ag
AAASur blanc
WCAG 11.42:1 · APCA Lc 96
Ag
FailSur noir
WCAG 1.83:1 · APCA Lc 0
Meilleure couleur de texte: #FFFFFF
WCAG 11.42:1 (AAA) · APCA Lc 96
Contrast pairs
Extraits de code
CSS
:root {
--atlantic-navy: #00377c;
--atlantic-navy-rgb: 0 55 124;
--atlantic-navy-oklch: oklch(0.352 0.129 257.7);
}
.element {
color: var(--atlantic-navy);
background-color: hsl(213 100% 24%);
border-color: oklch(0.352 0.129 257.7);
}Tailwind CSS v4
@theme {
--color-atlantic-navy: #00377c;
--color-atlantic-navy-50: #e0f7ff;
--color-atlantic-navy-100: #cfeaff;
--color-atlantic-navy-200: #b4d6ff;
--color-atlantic-navy-300: #90b9f9;
--color-atlantic-navy-400: #6da0ea;
--color-atlantic-navy-500: #4c86da;
--color-atlantic-navy-600: #4171b8;
--color-atlantic-navy-700: #345b94;
--color-atlantic-navy-800: #22436e;
--color-atlantic-navy-900: #162e4d;
--color-atlantic-navy-950: #071b33;
}SCSS
$atlantic-navy: #00377c;
$atlantic-navy-rgb: 0, 55, 124;
$atlantic-navy-light: mix(#fff, $atlantic-navy, 20%);
$atlantic-navy-dark: mix(#000, $atlantic-navy, 20%);
.element {
color: $atlantic-navy;
box-shadow: 0 0 0 2px rgba($atlantic-navy, 0.35);
}