Benannte Farbe · #4B5667
Property
Property ist #4B5667: rgb(75 86 103), hsl(216 16% 35%), oklch(0.45 0.031 259). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Property color name →
#4B5667
oklch(0.45 0.031 259)
Farbumrechnungen
- HEX
- #4b5667
- RGB
- rgb(75 86 103)
- HSL
- hsl(216 16% 35%)
- HWB
- hwb(216 29% 60%)
- OKLCH
- oklch(0.45 0.031 259)
- OKLab
- oklab(0.45 -0.006 -0.031)
- CIE Lab
- lab(36.1 -1.23 -11.37)
- LCH
- lch(36.1 11.43 263.8)
- CMYK
- cmyk(27% 17% 0% 60%)
Tints · Shades · Tones
Tints
- 5B6575
- 6C7584
- 7D8592
- 8E96A1
- A0A7B0
- B3B8C0
- C5C9CF
- D8DBDF
- EBEDEF
Shades
- 404A59
- 353E4B
- 2B323D
- 212730
- 171C23
- 0E1217
- 06080C
- 020204
- 000000
Tones
- 505A6A
- 555E6C
- 5A626F
- 606771
- 656B74
- 6A6F76
- 707379
- 75777B
- 7B7C7E
Farbharmonien
Komplementär +180°
- 4B5667
Property
- 5F5442
≈ Hiking Boots
Analog -30° +30°
- 4B5667
Property
- 435963
≈ Midnight in the Tropics
- 545366
≈ Academy Purple
Triadisch +120° +240°
- 4B5667
Property
- 664F4E
≈ Robeson Rose
- 4D5A49
≈ Verdant Hush
Geteilt komplementär +150° +210°
- 4B5667
Property
- 645046
≈ Mayan Chocolate
- 565743
≈ Second Nature
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 7.43:1 · APCA Lc 86
Ag
FailAuf Schwarz
WCAG 2.82:1 · APCA Lc 16
Beste Textfarbe: #FFFFFF
WCAG 7.43:1 (AAA) · APCA Lc 86
Contrast pairs
Code-Snippets
CSS
:root {
--property: #4b5667;
--property-rgb: 75 86 103;
--property-oklch: oklch(0.45 0.031 259);
}
.element {
color: var(--property);
background-color: hsl(216 16% 35%);
border-color: oklch(0.45 0.031 259);
}Tailwind CSS v4
@theme {
--color-property: #4b5667;
--color-property-50: #f0f5fe;
--color-property-100: #e2e8f3;
--color-property-200: #cdd5e2;
--color-property-300: #afb8c8;
--color-property-400: #949fb1;
--color-property-500: #7a879b;
--color-property-600: #677283;
--color-property-700: #525b69;
--color-property-800: #3c434d;
--color-property-900: #292e36;
--color-property-950: #171b21;
}SCSS
$property: #4b5667;
$property-rgb: 75, 86, 103;
$property-light: mix(#fff, $property, 20%);
$property-dark: mix(#000, $property, 20%);
.element {
color: $property;
box-shadow: 0 0 0 2px rgba($property, 0.35);
}