Couleur nommée · #203462
Navy Trim
Navy Trim correspond à #203462 : rgb(32 52 98), hsl(222 51% 25%), oklch(0.334 0.085 264.6). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Blue mean? → · Navy Trim color name →
#203462
oklch(0.334 0.085 264.6)
Conversions de couleur
- HEX
- #203462
- RGB
- rgb(32 52 98)
- HSL
- hsl(222 51% 25%)
- HWB
- hwb(222 13% 62%)
- OKLCH
- oklch(0.334 0.085 264.6)
- OKLab
- oklab(0.334 -0.008 -0.085)
- CIE Lab
- lab(22.03 4.72 -30.26)
- LCH
- lch(22.03 30.62 278.9)
- CMYK
- cmyk(67% 47% 0% 62%)
Teintes · Ombres · Tons
Teintes
- 334771
- 475981
- 5C6D90
- 7180A0
- 8795AF
- 9EA9BF
- B6BECF
- CED3DF
- E6E9EF
Ombres
- 1A2C54
- 152447
- 0F1C3A
- 0A152D
- 060E21
- 030716
- 01030B
- 000103
- 000000
Tons
- 293C66
- 324369
- 3B4B6C
- 45526F
- 4E5A72
- 586275
- 626978
- 6C717B
- 76787E
Harmonies de couleurs
Complémentaire +180°
- 203462
Navy Trim
- 473300
≈ Night in the Woods
Analogue -30° +30°
- 203462
Navy Trim
- 003C55
≈ Duskwood
- 3A2C5D
≈ Jakarta Skyline
Triadique +120° +240°
- 203462
Navy Trim
- 5B2120
≈ Red Oxide
- 144117
≈ Deep Pond
Complémentaire divisée +150° +210°
- 203462
Navy Trim
- 562800
≈ Conker Brown
- 363A00
≈ Dark Olive
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
AAASur blanc
WCAG 12.14:1 · APCA Lc 98
Ag
FailSur noir
WCAG 1.72:1 · APCA Lc 0
Meilleure couleur de texte: #FFFFFF
WCAG 12.14:1 (AAA) · APCA Lc 98
Contrast pairs
Extraits de code
CSS
:root {
--navy-trim: #203462;
--navy-trim-rgb: 32 52 98;
--navy-trim-oklch: oklch(0.334 0.085 264.6);
}
.element {
color: var(--navy-trim);
background-color: hsl(222 51% 25%);
border-color: oklch(0.334 0.085 264.6);
}Tailwind CSS v4
@theme {
--color-navy-trim: #203462;
--color-navy-trim-50: #eaf5ff;
--color-navy-trim-100: #dbe8ff;
--color-navy-trim-200: #c4d4fa;
--color-navy-trim-300: #a3b7e4;
--color-navy-trim-400: #859ed1;
--color-navy-trim-500: #6a85bf;
--color-navy-trim-600: #5a71a1;
--color-navy-trim-700: #485a81;
--color-navy-trim-800: #324260;
--color-navy-trim-900: #222e43;
--color-navy-trim-950: #111a2b;
}SCSS
$navy-trim: #203462;
$navy-trim-rgb: 32, 52, 98;
$navy-trim-light: mix(#fff, $navy-trim, 20%);
$navy-trim-dark: mix(#000, $navy-trim, 20%);
.element {
color: $navy-trim;
box-shadow: 0 0 0 2px rgba($navy-trim, 0.35);
}