Color con nombre · #54574F
Twilight Forest
Twilight Forest es #54574F: rgb(84 87 79), hsl(83 5% 33%), oklch(0.451 0.013 123.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Twilight Forest color name →
#54574F
oklch(0.451 0.013 123.7)
Conversiones de color
- HEX
- #54574f
- RGB
- rgb(84 87 79)
- HSL
- hsl(83 5% 33%)
- HWB
- hwb(83 31% 66%)
- OKLCH
- oklch(0.451 0.013 123.7)
- OKLab
- oklab(0.451 -0.007 0.011)
- CIE Lab
- lab(36.52 -2.49 4.23)
- LCH
- lch(36.52 4.91 120.5)
- CMYK
- cmyk(3% 0% 9% 66%)
Tintes · Sombras · Tonos
Tintes
- 63665F
- 73766F
- 848680
- 949691
- A5A7A3
- B7B8B4
- C8C9C7
- DADBD9
- ECEDEC
Sombras
- 484B44
- 3C3E38
- 31332E
- 262723
- 1B1C19
- 111210
- 080807
- 020302
- 000000
Tonos
- 585B54
- 5D5F58
- 61635D
- 656762
- 6A6B67
- 6E6F6C
- 727371
- 777876
- 7B7C7B
Armonías de color
Complementario +180°
- 54574F
Twilight Forest
- 57545C
≈ Coal Tipple
Análogo -30° +30°
- 54574F
Twilight Forest
- 58564D
≈ Shell Brown
- 505852
≈ Sunken Battleship
Triádico +120° +240°
- 54574F
Twilight Forest
- 50575D
≈ Bovine
- 5D5355
≈ Bittersweet Molasses
Complementario dividido +150° +210°
- 54574F
Twilight Forest
- 53555D
≈ Coal Tipple
- 5A5359
≈ Bittersweet Molasses
Tetrádico +90° +180° +270°
- 54574F
Twilight Forest
- 4E585A
≈ Cobalt Cannon
- 57545C
≈ Coal Tipple
- 5D5351
≈ Wolf’s Fur
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 7.36:1 · APCA Lc 86
Ag
FailSobre negro
WCAG 2.85:1 · APCA Lc 16
Mejor color de texto: #FFFFFF
WCAG 7.36:1 (AAA) · APCA Lc 86
Contrast pairs
Fragmentos de código
CSS
:root {
--twilight-forest: #54574f;
--twilight-forest-rgb: 84 87 79;
--twilight-forest-oklch: oklch(0.451 0.013 123.7);
}
.element {
color: var(--twilight-forest);
background-color: hsl(83 5% 33%);
border-color: oklch(0.451 0.013 123.7);
}Tailwind CSS v4
@theme {
--color-twilight-forest: #54574f;
--color-twilight-forest-50: #f4f6f2;
--color-twilight-forest-100: #e7e9e4;
--color-twilight-forest-200: #d3d5cf;
--color-twilight-forest-300: #b6b9b1;
--color-twilight-forest-400: #9da097;
--color-twilight-forest-500: #84887e;
--color-twilight-forest-600: #70736b;
--color-twilight-forest-700: #595c55;
--color-twilight-forest-800: #41433e;
--color-twilight-forest-900: #2d2e2b;
--color-twilight-forest-950: #1a1b18;
}SCSS
$twilight-forest: #54574f;
$twilight-forest-rgb: 84, 87, 79;
$twilight-forest-light: mix(#fff, $twilight-forest, 20%);
$twilight-forest-dark: mix(#000, $twilight-forest, 20%);
.element {
color: $twilight-forest;
box-shadow: 0 0 0 2px rgba($twilight-forest, 0.35);
}