Cor nomeada · #7B8F99
Sidewalk Grey
Sidewalk Grey é #7B8F99: rgb(123 143 153), hsl(200 13% 54%), oklch(0.638 0.027 229.4). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Sidewalk Grey color name →
#7B8F99
oklch(0.638 0.027 229.4)
Conversões de cor
- HEX
- #7b8f99
- RGB
- rgb(123 143 153)
- HSL
- hsl(200 13% 54%)
- HWB
- hwb(200 48% 40%)
- OKLCH
- oklch(0.638 0.027 229.4)
- OKLab
- oklab(0.638 -0.018 -0.021)
- CIE Lab
- lab(58.06 -5.72 -7.86)
- LCH
- lch(58.06 9.72 233.9)
- CMYK
- cmyk(20% 7% 0% 40%)
Tons claros · Sombras · Tons
Tons claros
- 889AA3
- 94A4AD
- A1AFB7
- AEBAC1
- BBC6CB
- C8D1D5
- D6DCDF
- E3E8EA
- F1F3F4
Sombras
- 6A7C84
- 5A6970
- 4A575D
- 3A454A
- 2C3438
- 1E2427
- 101517
- 050708
- 010101
Tons
- 7C8E96
- 7C8C94
- 7D8B91
- 7D898F
- 7E888C
- 7E868A
- 7F8587
- 7F8385
- 808282
Harmonias de cor
Complementar +180°
- 7B8F99
Sidewalk Grey
- 9A877D
≈ Antique Bear
Análoga -30° +30°
- 7B8F99
Sidewalk Grey
- 799192
≈ Miracle Bay
- 828C9D
≈ Prophetic Sea
Tríade +120° +240°
- 7B8F99
Sidewalk Grey
- 99858E
≈ Orchard Plum
- 8C8D7A
≈ Meander
Complementar dividida +150° +210°
- 7B8F99
Sidewalk Grey
- 9C8585
≈ Mauverine
- 948A79
≈ Sage Advice
Tétrade +90° +180° +270°
- 7B8F99
Sidewalk Grey
- 938696
≈ Femme Fatale
- 9A877D
≈ Antique Bear
- 839080
≈ Forest Moss
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 3.37:1 · APCA Lc 61
Ag
AASobre preto
WCAG 6.23:1 · APCA Lc 41
Melhor cor de texto: #000000
WCAG 6.23:1 (AA) · APCA Lc 41
Contrast pairs
Trechos de código
CSS
:root {
--sidewalk-grey: #7b8f99;
--sidewalk-grey-rgb: 123 143 153;
--sidewalk-grey-oklch: oklch(0.638 0.027 229.4);
}
.element {
color: var(--sidewalk-grey);
background-color: hsl(200 13% 54%);
border-color: oklch(0.638 0.027 229.4);
}Tailwind CSS v4
@theme {
--color-sidewalk-grey: #7b8f99;
--color-sidewalk-grey-50: #eef7fc;
--color-sidewalk-grey-100: #dfeaf0;
--color-sidewalk-grey-200: #c9d7de;
--color-sidewalk-grey-300: #aabac3;
--color-sidewalk-grey-400: #8fa2ac;
--color-sidewalk-grey-500: #748a95;
--color-sidewalk-grey-600: #62757e;
--color-sidewalk-grey-700: #4f5d65;
--color-sidewalk-grey-800: #39444a;
--color-sidewalk-grey-900: #272f33;
--color-sidewalk-grey-950: #151c1f;
}SCSS
$sidewalk-grey: #7b8f99;
$sidewalk-grey-rgb: 123, 143, 153;
$sidewalk-grey-light: mix(#fff, $sidewalk-grey, 20%);
$sidewalk-grey-dark: mix(#000, $sidewalk-grey, 20%);
.element {
color: $sidewalk-grey;
box-shadow: 0 0 0 2px rgba($sidewalk-grey, 0.35);
}