Cor nomeada mais próxima · #381A35
#381A35
Cor nomeada mais próxima: Nightly Voyager
#381A35 (rgb(56 26 53), hsl(306 37% 16%), oklch(0.272 0.063 330.9)) é mais próxima da cor nomeada Nightly Voyager. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#381A35
oklch(0.272 0.063 330.9)
Conversões de cor
- HEX
- #381a35
- RGB
- rgb(56 26 53)
- HSL
- hsl(306 37% 16%)
- HWB
- hwb(306 10% 78%)
- OKLCH
- oklch(0.272 0.063 330.9)
- OKLab
- oklab(0.272 0.055 -0.031)
- CIE Lab
- lab(14.6 18.63 -11.19)
- LCH
- lch(14.6 21.73 329)
- CMYK
- cmyk(0% 54% 5% 78%)
Tons claros · Sombras · Tons
Tons claros
- 4A2E47
- 5D4259
- 70576C
- 836E80
- 978494
- AB9CA8
- BFB4BE
- D4CCD3
- E9E5E9
Sombras
- 2F152D
- 271025
- 1F0C1D
- 170715
- 0F040E
- 080208
- 040103
- 010001
- 000000
Tons
- 3F243C
- 462D43
- 4E374B
- 554152
- 5C4B5A
- 635561
- 6A6069
- 726A70
- 797578
Harmonias de cor
Complementar +180°
- 381A35
Nightly Voyager
- 082F16
≈ Bush
Análoga -30° +30°
- 381A35
Nightly Voyager
- 2C1E41
≈ Throat
- 3F1825
≈ Black-Hearted
Tríade +120° +240°
- 381A35
Nightly Voyager
- 312500
≈ Black Swan
- 002D34
≈ Black Chasm
Complementar dividida +150° +210°
- 381A35
Nightly Voyager
- 222B01
≈ Lindworm Green
- 002E28
≈ Guerrilla Forest
Tétrade +90° +180° +270°
- 381A35
Nightly Voyager
- 3C1E00
≈ Medium Roast
- 082F16
≈ Bush
- 002A43
≈ Murky Depths
Contraste e acessibilidade
Ag
AAASobre branco
WCAG 15.35:1 · APCA Lc 102
Ag
FailSobre preto
WCAG 1.36:1 · APCA Lc 0
Melhor cor de texto: #FFFFFF
WCAG 15.35:1 (AAA) · APCA Lc 102
Contrast pairs
Trechos de código
CSS
:root {
--nightly-voyager: #381a35;
--nightly-voyager-rgb: 56 26 53;
--nightly-voyager-oklch: oklch(0.272 0.063 330.9);
}
.element {
color: var(--nightly-voyager);
background-color: hsl(306 37% 16%);
border-color: oklch(0.272 0.063 330.9);
}Tailwind CSS v4
@theme {
--color-nightly-voyager: #381a35;
--color-nightly-voyager-50: #ffeffd;
--color-nightly-voyager-100: #f6e0f1;
--color-nightly-voyager-200: #e6cbe0;
--color-nightly-voyager-300: #ccacc6;
--color-nightly-voyager-400: #b591b0;
--color-nightly-voyager-500: #9f779a;
--color-nightly-voyager-600: #866582;
--color-nightly-voyager-700: #6c5068;
--color-nightly-voyager-800: #4f3b4d;
--color-nightly-voyager-900: #372836;
--color-nightly-voyager-950: #221621;
}SCSS
$nightly-voyager: #381a35;
$nightly-voyager-rgb: 56, 26, 53;
$nightly-voyager-light: mix(#fff, $nightly-voyager, 20%);
$nightly-voyager-dark: mix(#000, $nightly-voyager, 20%);
.element {
color: $nightly-voyager;
box-shadow: 0 0 0 2px rgba($nightly-voyager, 0.35);
}