Color con nombre · #003399
Smalt
Smalt es #003399: rgb(0 51 153), hsl(220 100% 30%), oklch(0.371 0.173 262.1). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Blue mean? → · Smalt color name →
#003399
oklch(0.371 0.173 262.1)
Conversiones de color
- HEX
- #003399
- RGB
- rgb(0 51 153)
- HSL
- hsl(220 100% 30%)
- HWB
- hwb(220 0% 40%)
- OKLCH
- oklch(0.371 0.173 262.1)
- OKLab
- oklab(0.371 -0.024 -0.171)
- CIE Lab
- lab(24.65 21.04 -60.69)
- LCH
- lch(24.65 64.23 289.1)
- CMYK
- cmyk(100% 67% 0% 40%)
Tintes · Sombras · Tonos
Tintes
- 1C49A5
- 345EB0
- 4C72BB
- 6486C6
- 7D9AD0
- 96AEDA
- AFC2E4
- C9D6ED
- E4EBF6
Sombras
- 002B84
- 002370
- 001C5D
- 00144A
- 000D38
- 000727
- 000317
- 000108
- 000001
Tonos
- 103D98
- 1F4796
- 2B4F94
- 385792
- 445E90
- 50668E
- 5C6D8B
- 687388
- 747A84
Armonías de color
Complementario +180°
- 003399
Smalt
- 543B00
≈ Pineapple
Análogo -30° +30°
- 003399
Smalt
- 004661
≈ Loyal Blue
- 471D91
≈ Pitch Violet
Triádico +120° +240°
- 003399
Smalt
- 7C0017
≈ Mythical Wine
- 034F00
≈ Malachite Green
Complementario dividido +150° +210°
- 003399
Smalt
- 662E00
≈ Beasty Brown
- 414400
≈ Green Not Found
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 10.86:1 · APCA Lc 94
Ag
FailSobre negro
WCAG 1.93:1 · APCA Lc 8
Mejor color de texto: #FFFFFF
WCAG 10.86:1 (AAA) · APCA Lc 94
Contrast pairs
Fragmentos de código
CSS
:root {
--smalt: #003399;
--smalt-rgb: 0 51 153;
--smalt-oklch: oklch(0.371 0.173 262.1);
}
.element {
color: var(--smalt);
background-color: hsl(220 100% 30%);
border-color: oklch(0.371 0.173 262.1);
}Tailwind CSS v4
@theme {
--color-smalt: #003399;
--color-smalt-50: #dcf6ff;
--color-smalt-100: #cbe8ff;
--color-smalt-200: #afd4ff;
--color-smalt-300: #8ab5ff;
--color-smalt-400: #649bff;
--color-smalt-500: #427ff7;
--color-smalt-600: #396cd0;
--color-smalt-700: #2d56a7;
--color-smalt-800: #1b407d;
--color-smalt-900: #112c58;
--color-smalt-950: #04183c;
}SCSS
$smalt: #003399;
$smalt-rgb: 0, 51, 153;
$smalt-light: mix(#fff, $smalt, 20%);
$smalt-dark: mix(#000, $smalt, 20%);
.element {
color: $smalt;
box-shadow: 0 0 0 2px rgba($smalt, 0.35);
}