Color con nombre · #707C78
Grey Monument
Grey Monument es #707C78: rgb(112 124 120), hsl(160 5% 46%), oklch(0.575 0.015 173.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Grey Monument color name →
#707C78
oklch(0.575 0.015 173.8)
Conversiones de color
- HEX
- #707c78
- RGB
- rgb(112 124 120)
- HSL
- hsl(160 5% 46%)
- HWB
- hwb(160 44% 51%)
- OKLCH
- oklch(0.575 0.015 173.8)
- OKLab
- oklab(0.575 -0.015 0.002)
- CIE Lab
- lab(50.91 -5.25 0.59)
- LCH
- lch(50.91 5.28 173.6)
- CMYK
- cmyk(10% 0% 3% 51%)
Tintes · Sombras · Tonos
Tintes
- 7D8885
- 8B9591
- 99A19E
- A7AEAC
- B5BBB9
- C3C9C7
- D2D6D5
- E1E3E3
- F0F1F1
Sombras
- 606B67
- 515A57
- 434A48
- 353B39
- 272C2A
- 1A1E1D
- 0E1110
- 040505
- 010101
Tonos
- 727C79
- 737D7A
- 757D7A
- 767E7B
- 787E7C
- 7A7E7D
- 7B7F7E
- 7D7F7E
- 7E807F
Armonías de color
Complementario +180°
- 707C78
Grey Monument
- 817579
≈ Pumice Grey
Análogo -30° +30°
- 707C78
Grey Monument
- 747B73
≈ Coastal Dusk
- 6F7C7D
≈ Ocean Swell
Triádico +120° +240°
- 707C78
Grey Monument
- 797781
≈ Infamous
- 817770
≈ Gotham
Complementario dividido +150° +210°
- 707C78
Grey Monument
- 7E767E
≈ Chain Mail
- 827674
≈ Mink Suede
Tetrádico +90° +180° +270°
- 707C78
Grey Monument
- 747982
≈ Nimbostratus
- 817579
≈ Pumice Grey
- 7D786F
≈ Settlement
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 4.33:1 · APCA Lc 70
Ag
AASobre negro
WCAG 4.84:1 · APCA Lc 32
Mejor color de texto: #000000
WCAG 4.84:1 (AA) · APCA Lc 32
Contrast pairs
Fragmentos de código
CSS
:root {
--grey-monument: #707c78;
--grey-monument-rgb: 112 124 120;
--grey-monument-oklch: oklch(0.575 0.015 173.8);
}
.element {
color: var(--grey-monument);
background-color: hsl(160 5% 46%);
border-color: oklch(0.575 0.015 173.8);
}Tailwind CSS v4
@theme {
--color-grey-monument: #707c78;
--color-grey-monument-50: #f1f7f5;
--color-grey-monument-100: #e3eae7;
--color-grey-monument-200: #ced6d4;
--color-grey-monument-300: #b0bab7;
--color-grey-monument-400: #96a29e;
--color-grey-monument-500: #7c8a85;
--color-grey-monument-600: #697471;
--color-grey-monument-700: #545d5a;
--color-grey-monument-800: #3d4442;
--color-grey-monument-900: #2a2f2d;
--color-grey-monument-950: #181c1a;
}SCSS
$grey-monument: #707c78;
$grey-monument-rgb: 112, 124, 120;
$grey-monument-light: mix(#fff, $grey-monument, 20%);
$grey-monument-dark: mix(#000, $grey-monument, 20%);
.element {
color: $grey-monument;
box-shadow: 0 0 0 2px rgba($grey-monument, 0.35);
}