progress=50
– A progress bar that is 50% complete
progress=50/100
– A progress bar that is 50/100 complete
progress="$45/$50"
– A dollar value progress bar that is $45/$50 complete
progress=110
– A progress bar that has gone over 100%
progress=150/100
– A progress bar that has exceeded its goal
progress=$125/100
– A fundraising-style progress bar that has exceeded the goal.
Option
progress=50 option=red
– Displays a red progress bar.
progress=50 option="animated-candystripe green"
– Displays a green progress bar with an animated candystripe.
progress=50 option="candystripe orange"
– Displays an orange progress bar with a static candystripe
progress=50 option=candystripe
– Displays a default progress bar (blue) with a static candystripe
progress=50 option=flat color=red
– Displays a red progress bar with no inner shadow or gradient
progress=50 option="flat candystripe" color=gray
– Displays a gray progress bar with no inner shadow or gradient and a static candystripe
Location
progress=50 option=red location=after
– Displays a red progress bar with the progress displayed to the right of the progress bar.
progress=50 option="red candystripe" location=inside
– Displays a red progress bar with a static candystripe and the progress displayed inside the progress bar.
progress=85 location=after text="foo"
– Displays a progress bar with the text “foo” displayed after the progress bar.
Text
progress=75 text="My awesome text"
– Displays “My awesome text” inside a 75% progress bar.
progress=85 location=after text="foo"
– Displays “foo” after an 85% progress bar
progress=85 location=inside text="hello!"
– Displays “hello!” inside an 85% progress bar (note, default location for text is inside, so it isn’t required to specify “inside”).
Color
progress=50 color=rgb(123,50,87)
progress=55 color=rgba(123,64,99,0.3)
progress=22 color=#ff3257
progress=68 color=lightYellow
Endcolor
progress=72 color=turquoise endcolor=teal
progress=83 color=#ff2222 endcolor=#ff9984
progress=50 color=rgb(203,96,179) endcolor=rgb(173,18,131)
Gradient
progress=22 color=#ff0000 gradient=0.2
– Displays a red progress bar that gets lighter at the bottom
progress=22 color=#ff0000 gradient=-0.2
– Displays a red progress bar that gets darker at the bottom