Named color · #211D49
Azulado
Azulado is #211D49: rgb(33 29 73), hsl(245 43% 20%), oklch(0.263 0.079 283.6). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Azulado color name →
#211D49
oklch(0.263 0.079 283.6)
Color conversions
- HEX
- #211d49
- RGB
- rgb(33 29 73)
- HSL
- hsl(245 43% 20%)
- HWB
- hwb(245 11% 71%)
- OKLCH
- oklch(0.263 0.079 283.6)
- OKLab
- oklab(0.263 0.019 -0.077)
- CIE Lab
- lab(13.37 12.8 -27.38)
- LCH
- lch(13.37 30.23 295.1)
- CMYK
- cmyk(55% 60% 0% 71%)
Tints · Shades · Tones
Tints
- 33315A
- 46466C
- 5A5B7D
- 70708F
- 8687A1
- 9D9EB4
- B5B5C6
- CDCDD9
- E6E6EC
Shades
- 1B183E
- 161334
- 100E2A
- 0B0920
- 060517
- 03030E
- 010106
- 000002
- 000000
Tones
- 29274F
- 313055
- 3A3A5A
- 434460
- 4D4E66
- 57576B
- 616170
- 6B6B76
- 75767B
Color harmonies
Complementary +180°
- 211D49
Azulado
- 292600
≈ Liquorice Root
Analogous -30° +30°
- 211D49
Azulado
- 02244A
≈ Oxford Blue
- 32163F
≈ Blackcurrant
Triadic +120° +240°
- 211D49
Azulado
- 421400
≈ Black Chocolate
- 002D1D
≈ Bush
Split-complementary +150° +210°
- 211D49
Azulado
- 352000
≈ Black Swan
- 142C00
≈ Diminishing Green
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAAOn white
WCAG 15.71:1 · APCA Lc 102
Ag
FailOn black
WCAG 1.33:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 15.71:1 (AAA) · APCA Lc 102
Contrast pairs
Code snippets
CSS
:root {
--azulado: #211d49;
--azulado-rgb: 33 29 73;
--azulado-oklch: oklch(0.263 0.079 283.6);
}
.element {
color: var(--azulado);
background-color: hsl(245 43% 20%);
border-color: oklch(0.263 0.079 283.6);
}Tailwind CSS v4
@theme {
--color-azulado: #211d49;
--color-azulado-50: #f2f2ff;
--color-azulado-100: #e5e5ff;
--color-azulado-200: #d0d0f5;
--color-azulado-300: #b3b2df;
--color-azulado-400: #9899cc;
--color-azulado-500: #7f7fb9;
--color-azulado-600: #6c6c9c;
--color-azulado-700: #56567d;
--color-azulado-800: #3e3f5d;
--color-azulado-900: #2a2b41;
--color-azulado-950: #18192a;
}SCSS
$azulado: #211d49;
$azulado-rgb: 33, 29, 73;
$azulado-light: mix(#fff, $azulado, 20%);
$azulado-dark: mix(#000, $azulado, 20%);
.element {
color: $azulado;
box-shadow: 0 0 0 2px rgba($azulado, 0.35);
}