Najbliższy nazwany kolor · #5A8138
#5A8138
Najbliższy nazwany kolor: Shepherd’s Green
#5A8138 (rgb(90 129 56), hsl(92 39% 36%), oklch(0.557 0.111 132.4)) jest najbliższy nazwanemu kolorowi Shepherd’s Green. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#5A8138
oklch(0.557 0.111 132.4)
Konwersje koloru
- HEX
- #5a8138
- RGB
- rgb(90 129 56)
- HSL
- hsl(92 39% 36%)
- HWB
- hwb(92 22% 49%)
- OKLCH
- oklch(0.557 0.111 132.4)
- OKLab
- oklab(0.557 -0.075 0.082)
- CIE Lab
- lab(49.8 -24.13 34.38)
- LCH
- lch(49.8 42.01 125.1)
- CMYK
- cmyk(30% 0% 57% 49%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 698D4D
- 799A60
- 89A674
- 99B287
- AABF9A
- BACCAE
- CBD8C2
- DCE5D6
- EDF2EA
Odcienie ciemniejsze
- 4D6F2F
- 415E27
- 354E1F
- 293E17
- 1E2E0F
- 131F08
- 091204
- 030601
- 000100
Tony
- 5E8141
- 628149
- 668151
- 6A8158
- 6D815F
- 718166
- 75816D
- 798173
- 7C807A
Harmonie kolorów
Komplementarna +180°
- 5A8138
Shepherd’s Green
- 8A5FA2
≈ Chive Blossom
Analogowa -30° +30°
- 5A8138
Shepherd’s Green
- 817512
≈ Soft Fig
- 1F8760
≈ Primal Green
Triada +120° +240°
- 5A8138
Shepherd’s Green
- 3F76B3
≈ Petrel
- AA5562
≈ Grenadine
Komplementarna rozszczepiona +150° +210°
- 5A8138
Shepherd’s Green
- 6A6AB3
≈ Mediaeval
- 9F5785
≈ Feminism
Tetrada +90° +180° +270°
- 5A8138
Shepherd’s Green
- 00809F
≈ Best of Both Worlds
- 8A5FA2
≈ Chive Blossom
- A95B3C
≈ Gladiator Leather
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.53:1 · APCA Lc 71
Ag
AANa czerni
WCAG 4.63:1 · APCA Lc 30
Najlepszy kolor tekstu: #000000
WCAG 4.63:1 (AA) · APCA Lc 30
Contrast pairs
Fragmenty kodu
CSS
:root {
--shepherd-s-green: #5a8138;
--shepherd-s-green-rgb: 90 129 56;
--shepherd-s-green-oklch: oklch(0.557 0.111 132.4);
}
.element {
color: var(--shepherd-s-green);
background-color: hsl(92 39% 36%);
border-color: oklch(0.557 0.111 132.4);
}Tailwind CSS v4
@theme {
--color-shepherd-s-green: #5a8138;
--color-shepherd-s-green-50: #e8fddd;
--color-shepherd-s-green-100: #d9f1cb;
--color-shepherd-s-green-200: #c1dfaf;
--color-shepherd-s-green-300: #a0c48a;
--color-shepherd-s-green-400: #85ac66;
--color-shepherd-s-green-500: #699543;
--color-shepherd-s-green-600: #597e3a;
--color-shepherd-s-green-700: #47652e;
--color-shepherd-s-green-800: #354a1e;
--color-shepherd-s-green-900: #243314;
--color-shepherd-s-green-950: #131f06;
}SCSS
$shepherd-s-green: #5a8138;
$shepherd-s-green-rgb: 90, 129, 56;
$shepherd-s-green-light: mix(#fff, $shepherd-s-green, 20%);
$shepherd-s-green-dark: mix(#000, $shepherd-s-green, 20%);
.element {
color: $shepherd-s-green;
box-shadow: 0 0 0 2px rgba($shepherd-s-green, 0.35);
}