Nazwany kolor · #4D6B53
Medium Grey Green
Medium Grey Green to #4D6B53: rgb(77 107 83), hsl(132 16% 36%), oklch(0.497 0.052 150.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Medium Grey Green color name →
#4D6B53
oklch(0.497 0.052 150.3)
Konwersje koloru
- HEX
- #4d6b53
- RGB
- rgb(77 107 83)
- HSL
- hsl(132 16% 36%)
- HWB
- hwb(132 30% 58%)
- OKLCH
- oklch(0.497 0.052 150.3)
- OKLab
- oklab(0.497 -0.045 0.026)
- CIE Lab
- lab(42.33 -15.46 9.82)
- LCH
- lch(42.33 18.31 147.6)
- CMYK
- cmyk(28% 0% 22% 58%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 5E7963
- 6E8773
- 7F9583
- 91A494
- A2B2A5
- B4C1B6
- C7D0C8
- D9E0DA
- ECEFEC
Odcienie ciemniejsze
- 425C47
- 374E3B
- 2C3F30
- 223225
- 18251B
- 0F1811
- 070D08
- 020402
- 000000
Tony
- 526D57
- 576F5C
- 5D7160
- 627465
- 677669
- 6C786E
- 717A72
- 767C77
- 7B7E7B
Harmonie kolorów
Komplementarna +180°
- 4D6B53
Medium Grey Green
- 745870
≈ Exotic Orchid
Analogowa -30° +30°
- 4D6B53
Medium Grey Green
- 5E6745
≈ Woodland
- 3F6C64
≈ Smoke Pine
Triada +120° +240°
- 4D6B53
Medium Grey Green
- 576180
≈ Award Night
- 7D5751
≈ Sequoia Dusk
Komplementarna rozszczepiona +150° +210°
- 4D6B53
Medium Grey Green
- 675C7C
≈ Napa Winery
- 7C5661
≈ Royal Fig
Tetrada +90° +180° +270°
- 4D6B53
Medium Grey Green
- 47677D
≈ Gloomy Sea
- 745870
≈ Exotic Orchid
- 795C44
≈ Ridgeline
Kontrast i dostępność
Ag
AANa bieli
WCAG 5.92:1 · APCA Lc 80
Ag
FailNa czerni
WCAG 3.54:1 · APCA Lc 22
Najlepszy kolor tekstu: #FFFFFF
WCAG 5.92:1 (AA) · APCA Lc 80
Contrast pairs
Fragmenty kodu
CSS
:root {
--medium-grey-green: #4d6b53;
--medium-grey-green-rgb: 77 107 83;
--medium-grey-green-oklch: oklch(0.497 0.052 150.3);
}
.element {
color: var(--medium-grey-green);
background-color: hsl(132 16% 36%);
border-color: oklch(0.497 0.052 150.3);
}Tailwind CSS v4
@theme {
--color-medium-grey-green: #4d6b53;
--color-medium-grey-green-50: #ebfaee;
--color-medium-grey-green-100: #dcede0;
--color-medium-grey-green-200: #c5dbca;
--color-medium-grey-green-300: #a4bfab;
--color-medium-grey-green-400: #89a88f;
--color-medium-grey-green-500: #6e9074;
--color-medium-grey-green-600: #5d7a63;
--color-medium-grey-green-700: #4a624f;
--color-medium-grey-green-800: #364838;
--color-medium-grey-green-900: #253227;
--color-medium-grey-green-950: #141d15;
}SCSS
$medium-grey-green: #4d6b53;
$medium-grey-green-rgb: 77, 107, 83;
$medium-grey-green-light: mix(#fff, $medium-grey-green, 20%);
$medium-grey-green-dark: mix(#000, $medium-grey-green, 20%);
.element {
color: $medium-grey-green;
box-shadow: 0 0 0 2px rgba($medium-grey-green, 0.35);
}