Cor nomeada · #ACACA7
Classic Greyscale
Classic Greyscale é #ACACA7: rgb(172 172 167), hsl(60 3% 66%), oklch(0.743 0.007 106.6). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Classic Greyscale color name →
#ACACA7
oklch(0.743 0.007 106.6)
Conversões de cor
- HEX
- #acaca7
- RGB
- rgb(172 172 167)
- HSL
- hsl(60 3% 66%)
- HWB
- hwb(60 65% 33%)
- OKLCH
- oklch(0.743 0.007 106.6)
- OKLab
- oklab(0.743 -0.002 0.007)
- CIE Lab
- lab(70.24 -0.69 2.58)
- LCH
- lch(70.24 2.67 105)
- CMYK
- cmyk(0% 0% 3% 33%)
Tons claros · Sombras · Tons
Tons claros
- B4B4AF
- BCBCB8
- C4C4C1
- CCCCC9
- D5D5D2
- DDDDDB
- E5E5E4
- EEEEED
- F6F6F6
Sombras
- 959591
- 7F7F7B
- 696966
- 545452
- 40403E
- 2D2D2C
- 1B1B1A
- 0B0B0A
- 010101
Tons
- A7A7A3
- A3A39F
- 9F9F9B
- 9A9A97
- 969693
- 91918F
- 8D8D8C
- 898988
- 848484
Harmonias de cor
Complementar +180°
- ACACA7
Classic Greyscale
- ABABB0
≈ Sylph
Análoga -30° +30°
- ACACA7
Classic Greyscale
- AEABA7
≈ City Tower
- AAADA8
≈ Cool Granite
Tríade +120° +240°
- ACACA7
Classic Greyscale
- A7ADAF
≈ Gull Grey
- AFAAAC
≈ Silver Service
Complementar dividida +150° +210°
- ACACA7
Classic Greyscale
- A9ACB0
≈ Northern Light Grey
- ADAAAF
≈ Sylph
Tétrade +90° +180° +270°
- ACACA7
Classic Greyscale
- A7ADAD
≈ Gull Grey
- ABABB0
≈ Sylph
- B0AAAA
≈ Silver Service
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.27:1 · APCA Lc 45
Ag
AAASobre preto
WCAG 9.21:1 · APCA Lc 57
Melhor cor de texto: #000000
WCAG 9.21:1 (AAA) · APCA Lc 57
Contrast pairs
Trechos de código
CSS
:root {
--classic-greyscale: #acaca7;
--classic-greyscale-rgb: 172 172 167;
--classic-greyscale-oklch: oklch(0.743 0.007 106.6);
}
.element {
color: var(--classic-greyscale);
background-color: hsl(60 3% 66%);
border-color: oklch(0.743 0.007 106.6);
}Tailwind CSS v4
@theme {
--color-classic-greyscale: #acaca7;
--color-classic-greyscale-50: #f5f5f3;
--color-classic-greyscale-100: #e8e8e5;
--color-classic-greyscale-200: #d4d4d1;
--color-classic-greyscale-300: #b7b8b4;
--color-classic-greyscale-400: #9f9f9a;
--color-classic-greyscale-500: #868681;
--color-classic-greyscale-600: #72726d;
--color-classic-greyscale-700: #5b5b57;
--color-classic-greyscale-800: #434240;
--color-classic-greyscale-900: #2e2e2c;
--color-classic-greyscale-950: #1b1b19;
}SCSS
$classic-greyscale: #acaca7;
$classic-greyscale-rgb: 172, 172, 167;
$classic-greyscale-light: mix(#fff, $classic-greyscale, 20%);
$classic-greyscale-dark: mix(#000, $classic-greyscale, 20%);
.element {
color: $classic-greyscale;
box-shadow: 0 0 0 2px rgba($classic-greyscale, 0.35);
}