Benannte Farbe · #474C55
Asphalt Blue
Asphalt Blue ist #474C55: rgb(71 76 85), hsl(219 9% 31%), oklch(0.415 0.016 262.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Asphalt Blue color name →
#474C55
oklch(0.415 0.016 262.3)
Farbumrechnungen
- HEX
- #474c55
- RGB
- rgb(71 76 85)
- HSL
- hsl(219 9% 31%)
- HWB
- hwb(219 28% 67%)
- OKLCH
- oklch(0.415 0.016 262.3)
- OKLab
- oklab(0.415 -0.002 -0.016)
- CIE Lab
- lab(32.11 -0.48 -6.08)
- LCH
- lch(32.11 6.09 265.4)
- CMYK
- cmyk(16% 11% 0% 67%)
Tints · Shades · Tones
Tints
- 575C64
- 686D74
- 7A7E84
- 8C8F95
- 9EA1A6
- B1B3B7
- C4C6C9
- D7D8DB
- EBECED
Shades
- 3D4149
- 32363D
- 282C31
- 1F2226
- 16181C
- 0D0F11
- 060608
- 020202
- 000000
Tones
- 4C5159
- 52565D
- 585B62
- 5D6066
- 63656A
- 696B6F
- 6E7073
- 747577
- 7A7B7C
Farbharmonien
Komplementär +180°
- 474C55
Asphalt Blue
- 504B42
≈ Arrowhead
Analog -30° +30°
- 474C55
Asphalt Blue
- 434E53
≈ Sooty Lashes
- 4C4A54
≈ Downing Street
Triadisch +120° +240°
- 474C55
Asphalt Blue
- 544848
≈ Chinotto
- 474E46
≈ Model T
Geteilt komplementär +150° +210°
- 474C55
Asphalt Blue
- 534A44
≈ Brown Fox
- 4C4D43
≈ Ruskin Bronze
Tetradisch +90° +180° +270°
- 474C55
Asphalt Blue
- 53484D
≈ Smoky Quartz
- 504B42
≈ Arrowhead
- 434F4B
≈ Spinel Black
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 8.63:1 · APCA Lc 90
Ag
FailAuf Schwarz
WCAG 2.43:1 · APCA Lc 13
Beste Textfarbe: #FFFFFF
WCAG 8.63:1 (AAA) · APCA Lc 90
Contrast pairs
Code-Snippets
CSS
:root {
--asphalt-blue: #474c55;
--asphalt-blue-rgb: 71 76 85;
--asphalt-blue-oklch: oklch(0.415 0.016 262.3);
}
.element {
color: var(--asphalt-blue);
background-color: hsl(219 9% 31%);
border-color: oklch(0.415 0.016 262.3);
}Tailwind CSS v4
@theme {
--color-asphalt-blue: #474c55;
--color-asphalt-blue-50: #f3f5fa;
--color-asphalt-blue-100: #e5e8ed;
--color-asphalt-blue-200: #d1d4db;
--color-asphalt-blue-300: #b3b7c0;
--color-asphalt-blue-400: #999fa8;
--color-asphalt-blue-500: #808691;
--color-asphalt-blue-600: #6d727b;
--color-asphalt-blue-700: #575b62;
--color-asphalt-blue-800: #3f4348;
--color-asphalt-blue-900: #2b2e32;
--color-asphalt-blue-950: #191b1e;
}SCSS
$asphalt-blue: #474c55;
$asphalt-blue-rgb: 71, 76, 85;
$asphalt-blue-light: mix(#fff, $asphalt-blue, 20%);
$asphalt-blue-dark: mix(#000, $asphalt-blue, 20%);
.element {
color: $asphalt-blue;
box-shadow: 0 0 0 2px rgba($asphalt-blue, 0.35);
}