Color con nombre · #ABAFAE
Grey Mirage
Grey Mirage es #ABAFAE: rgb(171 175 174), hsl(165 2% 68%), oklch(0.751 0.005 179.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Grey Mirage color name →
#ABAFAE
oklch(0.751 0.005 179.7)
Conversiones de color
- HEX
- #abafae
- RGB
- rgb(171 175 174)
- HSL
- hsl(165 2% 68%)
- HWB
- hwb(165 67% 31%)
- OKLCH
- oklch(0.751 0.005 179.7)
- OKLab
- oklab(0.751 -0.005 0)
- CIE Lab
- lab(71.12 -1.6 -0.01)
- LCH
- lch(71.12 1.6 180.2)
- CMYK
- cmyk(2% 0% 1% 31%)
Tintes · Sombras · Tonos
Tintes
- B3B7B6
- BBBFBE
- C4C6C6
- CCCECE
- D4D6D6
- DDDEDE
- E5E6E6
- EEEFEE
- F6F7F7
Sombras
- 949897
- 7E8180
- 686B6A
- 545655
- 404141
- 2D2E2E
- 1B1C1C
- 0B0B0B
- 010101
Tonos
- A7AAA9
- A2A5A5
- 9EA1A0
- 9A9C9B
- 959797
- 919292
- 8D8E8E
- 888989
- 848584
Armonías de color
Complementario +180°
- ABAFAE
Grey Mirage
- B1ADAE
≈ Industrial Age
Análogo -30° +30°
- ABAFAE
Grey Mirage
- ACAFAC
≈ Mineral Deposit
- ABAFB0
≈ Grey Mirage
Triádico +120° +240°
- ABAFAE
Grey Mirage
- AEADB1
≈ Grey Timberwolf
- B0ADAB
≈ Industrial Age
Complementario dividido +150° +210°
- ABAFAE
Grey Mirage
- B0ADAF
≈ Industrial Age
- B1ADAC
≈ Smoky Wings
Tetrádico +90° +180° +270°
- ABAFAE
Grey Mirage
- ADAEB1
≈ Grey Timberwolf
- B1ADAE
≈ Industrial Age
- AFAEAB
≈ Industrial Age
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.21:1 · APCA Lc 44
Ag
AAASobre negro
WCAG 9.47:1 · APCA Lc 58
Mejor color de texto: #000000
WCAG 9.47:1 (AAA) · APCA Lc 58
Contrast pairs
Fragmentos de código
CSS
:root {
--grey-mirage: #abafae;
--grey-mirage-rgb: 171 175 174;
--grey-mirage-oklch: oklch(0.751 0.005 179.7);
}
.element {
color: var(--grey-mirage);
background-color: hsl(165 2% 68%);
border-color: oklch(0.751 0.005 179.7);
}Tailwind CSS v4
@theme {
--color-grey-mirage: #abafae;
--color-grey-mirage-50: #f4f5f5;
--color-grey-mirage-100: #e6e8e8;
--color-grey-mirage-200: #d2d5d4;
--color-grey-mirage-300: #b5b8b7;
--color-grey-mirage-400: #9c9f9e;
--color-grey-mirage-500: #838786;
--color-grey-mirage-600: #6f7271;
--color-grey-mirage-700: #595b5b;
--color-grey-mirage-800: #414342;
--color-grey-mirage-900: #2d2e2e;
--color-grey-mirage-950: #1a1b1b;
}SCSS
$grey-mirage: #abafae;
$grey-mirage-rgb: 171, 175, 174;
$grey-mirage-light: mix(#fff, $grey-mirage, 20%);
$grey-mirage-dark: mix(#000, $grey-mirage, 20%);
.element {
color: $grey-mirage;
box-shadow: 0 0 0 2px rgba($grey-mirage, 0.35);
}