Colore con nome più vicino · #00377C
#00377C
Colore con nome più vicino: Atlantic Navy
#00377C (rgb(0 55 124), hsl(213 100% 24%), oklch(0.352 0.129 257.7)) è più vicino al colore con nome Atlantic Navy. Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
#00377C
oklch(0.352 0.129 257.7)
Conversioni di colore
- 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%)
Tinte · Ombre · Toni
Tinte
- 1E4B8A
- 375E97
- 4E71A5
- 6685B2
- 7E99BF
- 97ADCC
- B0C1D9
- CAD5E6
- E4EAF2
Ombre
- 002E6B
- 00265A
- 001E4A
- 00163B
- 000F2C
- 00081E
- 000311
- 000105
- 000001
Toni
- 123F7D
- 21477E
- 2D4F7F
- 3A5680
- 455D81
- 516581
- 5D6C81
- 687281
- 747981
Armonie di colore
Complementare +180°
- 00377C
Atlantic Navy
- 503500
≈ Eyelash Camel
Analogo -30° +30°
- 00377C
Atlantic Navy
- 004157
≈ Maniac Mansion
- 3A2979
≈ Clear Purple
Triadico +120° +240°
- 00377C
Atlantic Navy
- 6F0E20
≈ Surya Red
- 194700
≈ Dark Fern
Complementare divisa +150° +210°
- 00377C
Atlantic Navy
- 612700
≈ Hot Fudge
- 3F3D00
≈ Dark Olive
Tetradico +90° +180° +270°
- 00377C
Atlantic Navy
- 671247
≈ Spanish Purple
- 503500
≈ Eyelash Camel
- 004633
≈ UP Forest Green
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 11.42:1 · APCA Lc 96
Ag
FailSu nero
WCAG 1.83:1 · APCA Lc 0
Miglior colore del testo: #FFFFFF
WCAG 11.42:1 (AAA) · APCA Lc 96
Contrast pairs
Frammenti di codice
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);
}