Color con nombre · #7B8F99
Sidewalk Grey
Sidewalk Grey es #7B8F99: rgb(123 143 153), hsl(200 13% 54%), oklch(0.638 0.027 229.4). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Sidewalk Grey color name →
#7B8F99
oklch(0.638 0.027 229.4)
Conversiones de color
- 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%)
Tintes · Sombras · Tonos
Tintes
- 889AA3
- 94A4AD
- A1AFB7
- AEBAC1
- BBC6CB
- C8D1D5
- D6DCDF
- E3E8EA
- F1F3F4
Sombras
- 6A7C84
- 5A6970
- 4A575D
- 3A454A
- 2C3438
- 1E2427
- 101517
- 050708
- 010101
Tonos
- 7C8E96
- 7C8C94
- 7D8B91
- 7D898F
- 7E888C
- 7E868A
- 7F8587
- 7F8385
- 808282
Armonías de color
Complementario +180°
- 7B8F99
Sidewalk Grey
- 9A877D
≈ Antique Bear
Análogo -30° +30°
- 7B8F99
Sidewalk Grey
- 799192
≈ Miracle Bay
- 828C9D
≈ Prophetic Sea
Triádico +120° +240°
- 7B8F99
Sidewalk Grey
- 99858E
≈ Orchard Plum
- 8C8D7A
≈ Meander
Complementario dividido +150° +210°
- 7B8F99
Sidewalk Grey
- 9C8585
≈ Mauverine
- 948A79
≈ Sage Advice
Tetrádico +90° +180° +270°
- 7B8F99
Sidewalk Grey
- 938696
≈ Femme Fatale
- 9A877D
≈ Antique Bear
- 839080
≈ Forest Moss
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 3.37:1 · APCA Lc 61
Ag
AASobre negro
WCAG 6.23:1 · APCA Lc 41
Mejor color de texto: #000000
WCAG 6.23:1 (AA) · APCA Lc 41
Contrast pairs
Fragmentos 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);
}