Cor nomeada · #445A5E
Volute
Volute é #445A5E: rgb(68 90 94), hsl(189 16% 32%), oklch(0.451 0.027 209.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Volute color name →
#445A5E
oklch(0.451 0.027 209.9)
Conversões de cor
- HEX
- #445a5e
- RGB
- rgb(68 90 94)
- HSL
- hsl(189 16% 32%)
- HWB
- hwb(189 27% 63%)
- OKLCH
- oklch(0.451 0.027 209.9)
- OKLab
- oklab(0.451 -0.024 -0.014)
- CIE Lab
- lab(36.54 -7.87 -5.2)
- LCH
- lch(36.54 9.43 213.4)
- CMYK
- cmyk(28% 4% 0% 63%)
Tons claros · Sombras · Tons
Tons claros
- 55696D
- 66797C
- 78888B
- 8A989B
- 9DA9AB
- B0BABB
- C3CBCC
- D7DCDD
- EBEDEE
Sombras
- 3A4D51
- 304144
- 263537
- 1D292B
- 141E1F
- 0C1314
- 05090A
- 020303
- 000000
Tons
- 4A5E61
- 506165
- 566568
- 5C696B
- 626D6F
- 687172
- 6E7476
- 747879
- 7A7C7D
Harmonias de cor
Complementar +180°
- 445A5E
Volute
- 64504D
≈ Spanish Raisin
Análoga -30° +30°
- 445A5E
Volute
- 455B56
≈ Hostaleaf
- 485864
≈ Flapper Dance
Tríade +120° +240°
- 445A5E
Volute
- 5F505D
≈ Wishing Star
- 5B5544
≈ Walnut Grove
Complementar dividida +150° +210°
- 445A5E
Volute
- 634F55
≈ Berry Wine
- 615246
≈ Volcanic Island
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
AAASobre branco
WCAG 7.31:1 · APCA Lc 85
Ag
FailSobre preto
WCAG 2.86:1 · APCA Lc 17
Melhor cor de texto: #FFFFFF
WCAG 7.31:1 (AAA) · APCA Lc 85
Contrast pairs
Trechos de código
CSS
:root {
--volute: #445a5e;
--volute-rgb: 68 90 94;
--volute-oklch: oklch(0.451 0.027 209.9);
}
.element {
color: var(--volute);
background-color: hsl(189 16% 32%);
border-color: oklch(0.451 0.027 209.9);
}Tailwind CSS v4
@theme {
--color-volute: #445a5e;
--color-volute-50: #edf7fa;
--color-volute-100: #deeaed;
--color-volute-200: #c8d8db;
--color-volute-300: #a8bbc0;
--color-volute-400: #8da3a7;
--color-volute-500: #728c90;
--color-volute-600: #60767a;
--color-volute-700: #4d5e62;
--color-volute-800: #384547;
--color-volute-900: #263031;
--color-volute-950: #141c1d;
}SCSS
$volute: #445a5e;
$volute-rgb: 68, 90, 94;
$volute-light: mix(#fff, $volute, 20%);
$volute-dark: mix(#000, $volute, 20%);
.element {
color: $volute;
box-shadow: 0 0 0 2px rgba($volute, 0.35);
}