Benannte Farbe · #49424A
Spinel Grey
Spinel Grey ist #49424A: rgb(73 66 74), hsl(292 6% 27%), oklch(0.389 0.016 322). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Spinel Grey color name →
#49424A
oklch(0.389 0.016 322)
Farbumrechnungen
- HEX
- #49424a
- RGB
- rgb(73 66 74)
- HSL
- hsl(292 6% 27%)
- HWB
- hwb(292 26% 71%)
- OKLCH
- oklch(0.389 0.016 322)
- OKLab
- oklab(0.389 0.013 -0.01)
- CIE Lab
- lab(28.91 4.37 -3.72)
- LCH
- lch(28.91 5.74 319.6)
- CMYK
- cmyk(1% 11% 0% 71%)
Tints · Shades · Tones
Tints
- 59535A
- 6A646B
- 7B767C
- 8D888E
- 9F9BA0
- B2AEB2
- C4C2C5
- D8D6D8
- EBEAEB
Shades
- 3E383F
- 342F35
- 2A252A
- 201C20
- 171417
- 0E0B0E
- 060506
- 020102
- 000000
Tones
- 4E484F
- 544E54
- 59545A
- 5E5A5F
- 646064
- 69666A
- 6F6D6F
- 757375
- 7A7A7A
Farbharmonien
Komplementär +180°
- 49424A
Spinel Grey
- 40473F
≈ Rich Olive
Analog -30° +30°
- 49424A
Spinel Grey
- 45434D
≈ Night Grey
- 4C4146
≈ Dark Burgundy Wine
Triadisch +120° +240°
- 49424A
Spinel Grey
- 49443B
≈ Earth Black
- 3B4748
≈ Panda Black
Geteilt komplementär +150° +210°
- 49424A
Spinel Grey
- 45463C
≈ Heavy Metal
- 3C4844
≈ Rich Olive
Tetradisch +90° +180° +270°
- 49424A
Spinel Grey
- 4C433D
≈ Vehicle Body Grey
- 40473F
≈ Rich Olive
- 3C464C
≈ Nightshade
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 9.71:1 · APCA Lc 93
Ag
FailAuf Schwarz
WCAG 2.16:1 · APCA Lc 10
Beste Textfarbe: #FFFFFF
WCAG 9.71:1 (AAA) · APCA Lc 93
Contrast pairs
Code-Snippets
CSS
:root {
--spinel-grey: #49424a;
--spinel-grey-rgb: 73 66 74;
--spinel-grey-oklch: oklch(0.389 0.016 322);
}
.element {
color: var(--spinel-grey);
background-color: hsl(292 6% 27%);
border-color: oklch(0.389 0.016 322);
}Tailwind CSS v4
@theme {
--color-spinel-grey: #49424a;
--color-spinel-grey-50: #f7f4f8;
--color-spinel-grey-100: #ebe6eb;
--color-spinel-grey-200: #d8d2d8;
--color-spinel-grey-300: #bcb5bc;
--color-spinel-grey-400: #a39ba4;
--color-spinel-grey-500: #8b838d;
--color-spinel-grey-600: #766f77;
--color-spinel-grey-700: #5e585f;
--color-spinel-grey-800: #454146;
--color-spinel-grey-900: #302d30;
--color-spinel-grey-950: #1c1a1d;
}SCSS
$spinel-grey: #49424a;
$spinel-grey-rgb: 73, 66, 74;
$spinel-grey-light: mix(#fff, $spinel-grey, 20%);
$spinel-grey-dark: mix(#000, $spinel-grey, 20%);
.element {
color: $spinel-grey;
box-shadow: 0 0 0 2px rgba($spinel-grey, 0.35);
}