Color con nombre · #999D9E
Pencil Sketch
Pencil Sketch es #999D9E: rgb(153 157 158), hsl(192 3% 61%), oklch(0.693 0.005 214.3). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Pencil Sketch color name →
#999D9E
oklch(0.693 0.005 214.3)
Conversiones de color
- HEX
- #999d9e
- RGB
- rgb(153 157 158)
- HSL
- hsl(192 3% 61%)
- HWB
- hwb(192 60% 38%)
- OKLCH
- oklch(0.693 0.005 214.3)
- OKLab
- oklab(0.693 -0.004 -0.003)
- CIE Lab
- lab(64.43 -1.34 -1.05)
- LCH
- lch(64.43 1.71 218.1)
- CMYK
- cmyk(3% 1% 0% 38%)
Tintes · Sombras · Tonos
Tintes
- A3A6A7
- ADB0B1
- B7B9BA
- C1C3C4
- CBCDCD
- D5D7D7
- DFE1E1
- EAEBEB
- F4F5F5
Sombras
- 848889
- 707374
- 5D5F60
- 4A4C4D
- 383A3A
- 272829
- 171818
- 080909
- 010101
Tonos
- 969A9B
- 949798
- 919495
- 8F9192
- 8C8E8F
- 8A8B8C
- 878989
- 858686
- 828383
Armonías de color
Complementario +180°
- 999D9E
Pencil Sketch
- 9F9B9A
≈ Paloma
Análogo -30° +30°
- 999D9E
Pencil Sketch
- 999D9C
≈ Pencil Sketch
- 9A9D9F
≈ Pencil Sketch
Triádico +120° +240°
- 999D9E
Pencil Sketch
- 9E9B9D
≈ Shady Lady
- 9D9C99
≈ Paloma
Complementario dividido +150° +210°
- 999D9E
Pencil Sketch
- 9F9B9C
≈ Shady Lady
- 9E9C99
≈ Paloma
Tetrádico +90° +180° +270°
- 999D9E
Pencil Sketch
- 9D9B9F
≈ Shady Lady
- 9F9B9A
≈ Paloma
- 9B9D99
≈ Pipe Dream
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.73:1 · APCA Lc 53
Ag
AAASobre negro
WCAG 7.67:1 · APCA Lc 49
Mejor color de texto: #000000
WCAG 7.67:1 (AAA) · APCA Lc 49
Contrast pairs
Fragmentos de código
CSS
:root {
--pencil-sketch: #999d9e;
--pencil-sketch-rgb: 153 157 158;
--pencil-sketch-oklch: oklch(0.693 0.005 214.3);
}
.element {
color: var(--pencil-sketch);
background-color: hsl(192 3% 61%);
border-color: oklch(0.693 0.005 214.3);
}Tailwind CSS v4
@theme {
--color-pencil-sketch: #999d9e;
--color-pencil-sketch-50: #f4f5f6;
--color-pencil-sketch-100: #e6e8e9;
--color-pencil-sketch-200: #d2d5d5;
--color-pencil-sketch-300: #b5b8b9;
--color-pencil-sketch-400: #9b9fa0;
--color-pencil-sketch-500: #838788;
--color-pencil-sketch-600: #6f7273;
--color-pencil-sketch-700: #585b5c;
--color-pencil-sketch-800: #404343;
--color-pencil-sketch-900: #2c2e2e;
--color-pencil-sketch-950: #1a1b1b;
}SCSS
$pencil-sketch: #999d9e;
$pencil-sketch-rgb: 153, 157, 158;
$pencil-sketch-light: mix(#fff, $pencil-sketch, 20%);
$pencil-sketch-dark: mix(#000, $pencil-sketch, 20%);
.element {
color: $pencil-sketch;
box-shadow: 0 0 0 2px rgba($pencil-sketch, 0.35);
}