Nazwany kolor · #58D332
Download Progress
Download Progress to #58D332: rgb(88 211 50), hsl(106 65% 51%), oklch(0.767 0.222 139.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Download Progress color name →
#58D332
oklch(0.767 0.222 139.6)
Konwersje koloru
- HEX
- #58d332
- RGB
- rgb(88 211 50)
- HSL
- hsl(106 65% 51%)
- HWB
- hwb(106 20% 17%)
- OKLCH
- oklch(0.767 0.222 139.6)
- OKLab
- oklab(0.767 -0.169 0.144)
- CIE Lab
- lab(75.49 -56.31 63.12)
- LCH
- lch(75.49 84.59 131.7)
- CMYK
- cmyk(58% 0% 76% 17%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 6DD850
- 80DD68
- 91E27D
- A2E791
- B2EBA4
- C2EFB7
- D1F4C9
- E1F8DB
- F0FBED
Odcienie ciemniejsze
- 4BB72A
- 3F9C22
- 33821B
- 286914
- 1D510D
- 123A07
- 092403
- 031001
- 000200
Tony
- 60CB42
- 66C34E
- 6BBB58
- 70B260
- 74AA67
- 77A26D
- 7A9A73
- 7C9177
- 7E897C
Harmonie kolorów
Komplementarna +180°
- 58D332
Download Progress
- E786FF
≈ Give Me Your Love
Analogowa -30° +30°
- 58D332
Download Progress
- BCBB00
≈ Pickled Limes
- 00D2A4
≈ Wild Caribbean Green
Triada +120° +240°
- 58D332
Download Progress
- 86B4FF
≈ Parakeet Blue
- FF8D8F
≈ Coral Trails
Komplementarna rozszczepiona +150° +210°
- 58D332
Download Progress
- B2A5FF
≈ Shy Moment
- FF83C3
≈ Pink Orchid Mantis
Tetrada +90° +180° +270°
- 58D332
Download Progress
- 17C4FF
≈ Shovel Knight
- E786FF
≈ Give Me Your Love
- FF9354
≈ Encounter
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.94:1 · APCA Lc 37
Ag
AAANa czerni
WCAG 10.77:1 · APCA Lc 65
Najlepszy kolor tekstu: #000000
WCAG 10.77:1 (AAA) · APCA Lc 65
Contrast pairs
Fragmenty kodu
CSS
:root {
--download-progress: #58d332;
--download-progress-rgb: 88 211 50;
--download-progress-oklch: oklch(0.767 0.222 139.6);
}
.element {
color: var(--download-progress);
background-color: hsl(106 65% 51%);
border-color: oklch(0.767 0.222 139.6);
}Tailwind CSS v4
@theme {
--color-download-progress: #58d332;
--color-download-progress-50: #d2ffcb;
--color-download-progress-100: #befbb6;
--color-download-progress-200: #9cec92;
--color-download-progress-300: #6ed362;
--color-download-progress-400: #47bb20;
--color-download-progress-500: #00a500;
--color-download-progress-600: #008b00;
--color-download-progress-700: #007000;
--color-download-progress-800: #0c5200;
--color-download-progress-900: #083900;
--color-download-progress-950: #002300;
}SCSS
$download-progress: #58d332;
$download-progress-rgb: 88, 211, 50;
$download-progress-light: mix(#fff, $download-progress, 20%);
$download-progress-dark: mix(#000, $download-progress, 20%);
.element {
color: $download-progress;
box-shadow: 0 0 0 2px rgba($download-progress, 0.35);
}