Colore con nome · #558961
Spring Garden
Spring Garden è #558961: rgb(85 137 97), hsl(134 23% 44%), oklch(0.582 0.083 150.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Green mean? → · Spring Garden color name →
#558961
oklch(0.582 0.083 150.5)
Conversioni di colore
- HEX
- #558961
- RGB
- rgb(85 137 97)
- HSL
- hsl(134 23% 44%)
- HWB
- hwb(134 33% 46%)
- OKLCH
- oklch(0.582 0.083 150.5)
- OKLab
- oklab(0.582 -0.072 0.041)
- CIE Lab
- lab(52.6 -24.95 15.82)
- LCH
- lch(52.6 29.54 147.6)
- CMYK
- cmyk(38% 0% 29% 46%)
Tinte · Ombre · Toni
Tinte
- 669470
- 76A07F
- 87AB8E
- 98B79E
- A9C3AD
- BACFBD
- CBDBCD
- DCE7DE
- EDF3EE
Ombre
- 497653
- 3D6446
- 315339
- 26422D
- 1C3121
- 112215
- 08140B
- 020703
- 000100
Toni
- 5A8864
- 5F8767
- 64876B
- 68866E
- 6C8571
- 708474
- 748377
- 78827A
- 7C817D
Armonie di colore
Complementare +180°
- 558961
Spring Garden
- 976992
≈ Tulipan Violet
Analogo -30° +30°
- 558961
Spring Garden
- 748249
≈ Grasshopper
- 388B7D
≈ Copper Turquoise
Triadico +120° +240°
- 558961
Spring Garden
- 6878AD
≈ Regal Azure
- A6685D
≈ Mudbrick
Complementare divisa +150° +210°
- 558961
Spring Garden
- 836FA5
≈ Babiana
- A46678
≈ Heather Rose
Tetradico +90° +180° +270°
- 558961
Spring Garden
- 4A81A7
≈ Lake Henry
- 976992
≈ Tulipan Violet
- 9F6F46
≈ Autumn Bark
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.08:1 · APCA Lc 68
Ag
AASu nero
WCAG 5.13:1 · APCA Lc 34
Miglior colore del testo: #000000
WCAG 5.13:1 (AA) · APCA Lc 34
Contrast pairs
Frammenti di codice
CSS
:root {
--spring-garden: #558961;
--spring-garden-rgb: 85 137 97;
--spring-garden-oklch: oklch(0.582 0.083 150.5);
}
.element {
color: var(--spring-garden);
background-color: hsl(134 23% 44%);
border-color: oklch(0.582 0.083 150.5);
}Tailwind CSS v4
@theme {
--color-spring-garden: #558961;
--color-spring-garden-50: #e4fdea;
--color-spring-garden-100: #d4f0db;
--color-spring-garden-200: #bbdfc3;
--color-spring-garden-300: #98c4a3;
--color-spring-garden-400: #7aad85;
--color-spring-garden-500: #5b9669;
--color-spring-garden-600: #4e7f59;
--color-spring-garden-700: #3e6547;
--color-spring-garden-800: #2d4a32;
--color-spring-garden-900: #1f3422;
--color-spring-garden-950: #0e1f11;
}SCSS
$spring-garden: #558961;
$spring-garden-rgb: 85, 137, 97;
$spring-garden-light: mix(#fff, $spring-garden, 20%);
$spring-garden-dark: mix(#000, $spring-garden, 20%);
.element {
color: $spring-garden;
box-shadow: 0 0 0 2px rgba($spring-garden, 0.35);
}