Colore con nome più vicino · #5A8138
#5A8138
Colore con nome più vicino: Shepherd’s Green
#5A8138 (rgb(90 129 56), hsl(92 39% 36%), oklch(0.557 0.111 132.4)) è più vicino al colore con nome Shepherd’s Green. Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
#5A8138
oklch(0.557 0.111 132.4)
Conversioni di colore
- 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%)
Tinte · Ombre · Toni
Tinte
- 698D4D
- 799A60
- 89A674
- 99B287
- AABF9A
- BACCAE
- CBD8C2
- DCE5D6
- EDF2EA
Ombre
- 4D6F2F
- 415E27
- 354E1F
- 293E17
- 1E2E0F
- 131F08
- 091204
- 030601
- 000100
Toni
- 5E8141
- 628149
- 668151
- 6A8158
- 6D815F
- 718166
- 75816D
- 798173
- 7C807A
Armonie di colore
Complementare +180°
- 5A8138
Shepherd’s Green
- 8A5FA2
≈ Chive Blossom
Analogo -30° +30°
- 5A8138
Shepherd’s Green
- 817512
≈ Soft Fig
- 1F8760
≈ Primal Green
Triadico +120° +240°
- 5A8138
Shepherd’s Green
- 3F76B3
≈ Petrel
- AA5562
≈ Grenadine
Complementare divisa +150° +210°
- 5A8138
Shepherd’s Green
- 6A6AB3
≈ Mediaeval
- 9F5785
≈ Feminism
Tetradico +90° +180° +270°
- 5A8138
Shepherd’s Green
- 00809F
≈ Best of Both Worlds
- 8A5FA2
≈ Chive Blossom
- A95B3C
≈ Gladiator Leather
Contrasto e accessibilità
Ag
AASu bianco
WCAG 4.53:1 · APCA Lc 71
Ag
AASu nero
WCAG 4.63:1 · APCA Lc 30
Miglior colore del testo: #000000
WCAG 4.63:1 (AA) · APCA Lc 30
Contrast pairs
Frammenti di codice
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);
}