Progress.rocks - 動態 SVG 進度條

🚀 快手開始

就咁用： https://progress.rocks/{value}/

試下：: https://progress.rocks/75/ 75% 進度

📋 參數

參數	描述	預設值
`title`	顯示喺左邊嘅標籤文字	冇
`scale`	最大值（係100嘅時候會將數值變成百分比）	100
`width`	進度條部分嘅像素闊度	90（有標題嘅時候係60）
`color`	標題部分嘅十六進制顏色	#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/