Color con nombre más cercano · #476F7C
#476F7C
Color con nombre más cercano: Winter Storm
#476F7C (rgb(71 111 124), hsl(195 27% 38%), oklch(0.517 0.049 220.4)) se parece más al color con nombre Winter Storm. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#476F7C
oklch(0.517 0.049 220.4)
Conversiones de color
- HEX
- #476f7c
- RGB
- rgb(71 111 124)
- HSL
- hsl(195 27% 38%)
- HWB
- hwb(195 28% 51%)
- OKLCH
- oklch(0.517 0.049 220.4)
- OKLab
- oklab(0.517 -0.037 -0.032)
- CIE Lab
- lab(44.26 -11.84 -11.92)
- LCH
- lch(44.26 16.8 225.2)
- CMYK
- cmyk(43% 10% 0% 51%)
Tintes · Sombras · Tonos
Tintes
- 597D88
- 6A8A95
- 7C98A2
- 8EA6AF
- A0B5BC
- B3C3C9
- C5D2D6
- D8E1E4
- ECF0F1
Sombras
- 3D606B
- 32515A
- 28424A
- 1F343B
- 16272C
- 0D1A1E
- 060E11
- 020405
- 000101
Tonos
- 4D717C
- 53737D
- 59747D
- 5F767E
- 65787E
- 6A797F
- 707B7F
- 757D7F
- 7B7E80
Armonías de color
Complementario +180°
- 476F7C
Winter Storm
- 815F53
≈ Spanish Chestnut
Análogo -30° +30°
- 476F7C
Winter Storm
- 45716F
≈ Sinkhole
- 536B84
≈ Aurora Borealis
Triádico +120° +240°
- 476F7C
Winter Storm
- 7C5D71
≈ Chicha Morada
- 6E6948
≈ Austere
Complementario dividido +150° +210°
- 476F7C
Winter Storm
- 825D61
≈ Tarsier
- 7B6349
≈ Bonnie’s Bench
Tetrádico +90° +180° +270°
- 476F7C
Winter Storm
- 71607E
≈ Grape Compote
- 815F53
≈ Spanish Chestnut
- 5E6E50
≈ Cactus
Contraste y accesibilidad
Ag
AASobre blanco
WCAG 5.47:1 · APCA Lc 77
Ag
FailSobre negro
WCAG 3.83:1 · APCA Lc 24
Mejor color de texto: #FFFFFF
WCAG 5.47:1 (AA) · APCA Lc 77
Contrast pairs
Fragmentos de código
CSS
:root {
--winter-storm: #476f7c;
--winter-storm-rgb: 71 111 124;
--winter-storm-oklch: oklch(0.517 0.049 220.4);
}
.element {
color: var(--winter-storm);
background-color: hsl(195 27% 38%);
border-color: oklch(0.517 0.049 220.4);
}Tailwind CSS v4
@theme {
--color-winter-storm: #476f7c;
--color-winter-storm-50: #e7f9ff;
--color-winter-storm-100: #d7ecf4;
--color-winter-storm-200: #bed9e4;
--color-winter-storm-300: #9dbeca;
--color-winter-storm-400: #7ea6b3;
--color-winter-storm-500: #618e9d;
--color-winter-storm-600: #527885;
--color-winter-storm-700: #42606a;
--color-winter-storm-800: #2f474e;
--color-winter-storm-900: #203136;
--color-winter-storm-950: #0f1d21;
}SCSS
$winter-storm: #476f7c;
$winter-storm-rgb: 71, 111, 124;
$winter-storm-light: mix(#fff, $winter-storm, 20%);
$winter-storm-dark: mix(#000, $winter-storm, 20%);
.element {
color: $winter-storm;
box-shadow: 0 0 0 2px rgba($winter-storm, 0.35);
}