Colore con nome · #A6A3A9
Mysterious Mauve
Mysterious Mauve è #A6A3A9: rgb(166 163 169), hsl(270 3% 65%), oklch(0.72 0.009 308.3). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Mysterious Mauve color name →
#A6A3A9
oklch(0.72 0.009 308.3)
Conversioni di colore
- HEX
- #a6a3a9
- RGB
- rgb(166 163 169)
- HSL
- hsl(270 3% 65%)
- HWB
- hwb(270 64% 34%)
- OKLCH
- oklch(0.72 0.009 308.3)
- OKLab
- oklab(0.72 0.006 -0.007)
- CIE Lab
- lab(67.39 1.97 -2.72)
- LCH
- lch(67.39 3.35 305.9)
- CMYK
- cmyk(2% 4% 0% 34%)
Tinte · Ombre · Toni
Tinte
- AFACB1
- B7B5BA
- C0BEC2
- C9C7CB
- D2D0D3
- DBD9DC
- E4E3E5
- EDECED
- F6F5F6
Ombre
- 908D92
- 7A787C
- 656367
- 514F53
- 3E3C3F
- 2B2A2C
- 1A191B
- 0A0A0A
- 010101
Toni
- A29FA5
- 9E9CA1
- 9A989C
- 979598
- 939194
- 8F8E90
- 8B8A8C
- 878788
- 848384
Armonie di colore
Complementare +180°
- A6A3A9
Mysterious Mauve
- A3A6A0
≈ Unusual Grey
Analogo -30° +30°
- A6A3A9
Mysterious Mauve
- A3A4AA
≈ Lionfish
- A9A2A6
≈ Beijing Moon
Triadico +120° +240°
- A6A3A9
Mysterious Mauve
- A8A49E
≈ Ashlite
- 9EA6A5
≈ Silent Film
Complementare divisa +150° +210°
- A6A3A9
Mysterious Mauve
- A6A59E
≈ Hazy Stratus
- A0A6A2
≈ Puddle
Tetradico +90° +180° +270°
- A6A3A9
Mysterious Mauve
- AAA3A0
≈ Caboose
- A3A6A0
≈ Unusual Grey
- 9EA6A8
≈ Chance of Rain
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.49:1 · APCA Lc 49
Ag
AAASu nero
WCAG 8.43:1 · APCA Lc 53
Miglior colore del testo: #000000
WCAG 8.43:1 (AAA) · APCA Lc 53
Contrast pairs
Frammenti di codice
CSS
:root {
--mysterious-mauve: #a6a3a9;
--mysterious-mauve-rgb: 166 163 169;
--mysterious-mauve-oklch: oklch(0.72 0.009 308.3);
}
.element {
color: var(--mysterious-mauve);
background-color: hsl(270 3% 65%);
border-color: oklch(0.72 0.009 308.3);
}Tailwind CSS v4
@theme {
--color-mysterious-mauve: #a6a3a9;
--color-mysterious-mauve-50: #f6f4f7;
--color-mysterious-mauve-100: #e9e7ea;
--color-mysterious-mauve-200: #d5d3d7;
--color-mysterious-mauve-300: #b9b6bb;
--color-mysterious-mauve-400: #a09da3;
--color-mysterious-mauve-500: #88858b;
--color-mysterious-mauve-600: #737076;
--color-mysterious-mauve-700: #5c5a5e;
--color-mysterious-mauve-800: #434245;
--color-mysterious-mauve-900: #2e2d30;
--color-mysterious-mauve-950: #1b1a1c;
}SCSS
$mysterious-mauve: #a6a3a9;
$mysterious-mauve-rgb: 166, 163, 169;
$mysterious-mauve-light: mix(#fff, $mysterious-mauve, 20%);
$mysterious-mauve-dark: mix(#000, $mysterious-mauve, 20%);
.element {
color: $mysterious-mauve;
box-shadow: 0 0 0 2px rgba($mysterious-mauve, 0.35);
}