Progress.rocks - 동적 SVG 진행률 표시줄

🚀 빠른 시작

간단히 사용하세요: https://progress.rocks/{value}/

시도해보세요:: https://progress.rocks/75/ 75% 진행률

📋 매개변수

매개변수	설명	기본값
`title`	왼쪽에 표시되는 라벨 텍스트	없음
`scale`	최대값 (100일 때 값을 백분율로 만듦)	100
`width`	진행률 표시줄 부분의 픽셀 너비	90 (제목이 있는 경우 60)
`color`	제목 섹션의 16진수 색상	#428bca
`suffix`	진행률 값 뒤의 텍스트 접미사	%

예시

기본 진행률

75% 진행률

간단한 75% 진행률

https://progress.rocks/75/

42.7% 진행률

소수점 정밀도

https://progress.rocks/42.7/

제목 포함

85% 커버리지

테스트 커버리지 진행률

https://progress.rocks/85/?title=커버리지

67% 빌드

빌드 상태

https://progress.rocks/67/?title=Build

사용자 정의 스케일

$15420 모금됨

모금 진행률

https://progress.rocks/15420/?scale=25000&suffix=$&title=모금됨

7/10 레슨

학습 진행률

https://progress.rocks/7/?scale=10&suffix=/10&title=레슨

1337pts 점수

게임 점수

https://progress.rocks/1337/?scale=2000&suffix=pts&title=점수

시스템 모니터링

72% CPU

CPU 사용량

https://progress.rocks/72/?title=CPU

120GB 디스크 공간

디스크 공간 사용량

https://progress.rocks/120/?title=디스크 공간&scale=250&suffix=GB

사용자 정의 스타일링

67% 사용자 정의

사용자 정의 색상

https://progress.rocks/67/?title=사용자 정의&color=ff6b6b

67.65% 설치 진행률

넓은 막대

https://progress.rocks/67.65/?title=설치 진행률&width=300

통합

Markdown

![Progress](https://progress.rocks/67/?title=프로젝트)

HTML

<img src="/85/?title=완료" alt="85% Complete">

직접 링크

https://progress.rocks/75/