Colore con nome · #516572
Slate
Slate è #516572: rgb(81 101 114), hsl(204 17% 38%), oklch(0.495 0.032 236.8). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Slate color name →
#516572
oklch(0.495 0.032 236.8)
Conversioni di colore
- HEX
- #516572
- RGB
- rgb(81 101 114)
- HSL
- hsl(204 17% 38%)
- HWB
- hwb(204 32% 55%)
- OKLCH
- oklch(0.495 0.032 236.8)
- OKLab
- oklab(0.495 -0.017 -0.027)
- CIE Lab
- lab(41.5 -5.3 -9.96)
- LCH
- lch(41.5 11.28 242)
- CMYK
- cmyk(29% 11% 0% 55%)
Tinte · Ombre · Toni
Tinte
- 61737F
- 71828D
- 82919A
- 93A0A8
- A4AFB6
- B6BFC4
- C8CED3
- DADEE1
- ECEFF0
Ombre
- 455762
- 3A4953
- 2F3C44
- 242F36
- 1A2228
- 10171B
- 070C0E
- 020304
- 000001
Toni
- 566873
- 5A6A75
- 5F6D76
- 647078
- 687279
- 6D757B
- 72787C
- 777B7D
- 7B7D7F
Armonie di colore
Complementare +180°
- 516572
Slate
- 705E50
≈ Rich Brown
Analogo -30° +30°
- 516572
Slate
- 4D676B
≈ Sumatra Chicken
- 5A6275
≈ Pencil Lead
Triadico +120° +240°
- 516572
Slate
- 725B62
≈ Poetry Plum
- 606450
≈ Newbury Moss
Complementare divisa +150° +210°
- 516572
Slate
- 735B58
≈ Peppercorn
- 6A614D
≈ Ivy Topiary
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
AASu bianco
WCAG 6.07:1 · APCA Lc 80
Ag
FailSu nero
WCAG 3.45:1 · APCA Lc 21
Miglior colore del testo: #FFFFFF
WCAG 6.07:1 (AA) · APCA Lc 80
Contrast pairs
Frammenti di codice
CSS
:root {
--slate: #516572;
--slate-rgb: 81 101 114;
--slate-oklch: oklch(0.495 0.032 236.8);
}
.element {
color: var(--slate);
background-color: hsl(204 17% 38%);
border-color: oklch(0.495 0.032 236.8);
}Tailwind CSS v4
@theme {
--color-slate: #516572;
--color-slate-50: #edf7fd;
--color-slate-100: #dfeaf2;
--color-slate-200: #c8d7e1;
--color-slate-300: #a9bac6;
--color-slate-400: #8da2af;
--color-slate-500: #738a99;
--color-slate-600: #617581;
--color-slate-700: #4e5d68;
--color-slate-800: #38444c;
--color-slate-900: #262f35;
--color-slate-950: #151c20;
}SCSS
$slate: #516572;
$slate-rgb: 81, 101, 114;
$slate-light: mix(#fff, $slate, 20%);
$slate-dark: mix(#000, $slate, 20%);
.element {
color: $slate;
box-shadow: 0 0 0 2px rgba($slate, 0.35);
}