<aside> 🧙‍♂️ Why not spice up your tracking with some fancy progress bars? Be sure to Favorite this page as I’ll be keeping it updated with new bars I create over time!

</aside>

$\color{#4fb0ae}\Large\textbf{Color Progress Bars}$

Green is Life

$\color{#4fb0ae}\small\textbf{⚪ Light}$

Green is Life Light.png

$\color{#4fb0ae}\small\textbf{⚫ Dark}$

Green is Life Dark.png

concat(slice(format("🟢🟢🟢🟢🟢🟢🟢🟢🟢🟢"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

Save the Princess

$\color{#4fb0ae}\small\textbf{⚪ Light}$

Save the Princess Light.png

$\color{#4fb0ae}\small\textbf{⚫ Dark}$

Save the Princess Dark.png

concat(slice(format("💗💗💗💗💗💗💗💗💗💗"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("🤍🤍🤍🤍🤍🤍🤍🤍🤍🤍"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

Parent/Sub-Tasks

$\color{#4fb0ae}\small\textbf{⚪ Light}$

Parent & Sub-Tasks Light.png

$\color{#4fb0ae}\small\textbf{⚫ Dark}$

Parent & Sub-Tasks Dark.png

concat(slice(format("🔶🔶🔶🔶🔶🔶🔶🔶🔶🔶"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("💠💠💠💠💠💠💠💠💠💠"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

Danger Zone

$\color{#4fb0ae}\small\textbf{⚪ Light}$

Danger Zone Light.png

$\color{#4fb0ae}\small\textbf{⚫ Dark}$

Danger Zone Dark.png

concat(slice(format("🔴🔴🔴🔴🔴🔴🔴🔴🔴🔴"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("⭕⭕⭕⭕⭕⭕⭕⭕⭕⭕"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

Boom!

$\color{#4fb0ae}\small\textbf{⚪ Light}$

Boom! Light.png

$\color{#4fb0ae}\small\textbf{⚫ Dark}$

Boom! Dark.png

concat(slice(format("💥💥💥💥💥💥💥💥💥💥"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("💢💢💢💢💢💢💢💢💢💢"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

Wizards Everywhere!

$\color{#4fb0ae}\small\textbf{⚪ Light}$

Wizards Everywhere!-1.png

$\color{#4fb0ae}\small\textbf{⚫ Dark}$

Wizards Everywhere!.png

concat(slice(format("🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️"), 0, 5 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("💫💫💫💫💫💫💫💫💫💫"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

$\color{#4fb0ae}\Large\textbf{Black \& White Progress Bars}$

Round & Round

$\color{#4fb0ae}\small\textbf{⚪ Light}$

Round & Round Light.png

concat(slice(format("◈◈◈◈◈◈◈◈◈◈"), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("◇◇◇◇◇◇◇◇◇◇"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

Affordable Diamonds

concat(slice(format("●●●●●●●●●●"), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("◌◌◌◌◌◌◌◌◌◌"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

Square Cubed

concat(slice(format("▣▣▣▣▣▣▣▣▣▣"), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("▢▢▢▢▢▢▢▢▢▢"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

//complete state
if(prop("Done Items") / prop("Total Items") >= 1, concat("CompleteIcons" + " 100%"), prop("IncompleteIcons"))

//bar formula

floor(10 * prop("Done Items") / prop("Total Items")) + //# complete lowest 10%
ceil(10 * prop("Incomplete Items") / prop("Total Items")) +             //# incomplete highest 10% 
round(100 * prop("Done Items") / prop("Total Items"))             //% complete nearest 1%

////partial or complete condition
concat(slice(format(prop("CompleteIcons")), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format(prop("IncompleteIcons")), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))))

//full formula with % complete text
concat(slice(format(prop("CompleteIcons")), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format(prop("IncompleteIcons")), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(round(100 * prop("Done Items") / prop("Total Items"))) + "%")

if(prop("Done Items") / prop("Total Items") >= 1, concat("CompleteIcons" + " 100%"), prop("IncompleteIcons"))

⚫🟢
concat(slice(format("🟢🟢🟢🟢🟢🟢🟢🟢🟢🟢"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
🤍💗
concat(slice(format("💗💗💗💗💗💗💗💗💗💗"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("🤍🤍🤍🤍🤍🤍🤍🤍🤍🤍"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
💠🔶
concat(slice(format("🔶🔶🔶🔶🔶🔶🔶🔶🔶🔶"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("💠💠💠💠💠💠💠💠💠💠"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
⭕🔴
concat(slice(format("🔴🔴🔴🔴🔴🔴🔴🔴🔴🔴"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("⭕⭕⭕⭕⭕⭕⭕⭕⭕⭕"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
💢💥
concat(slice(format("💥💥💥💥💥💥💥💥💥💥"), 0, 2 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("💢💢💢💢💢💢💢💢💢💢"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
💫🧙‍♂️
concat(slice(format("🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️"), 0, 5 * floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("💫💫💫💫💫💫💫💫💫💫"), 0, 2 * ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
◌●
concat(slice(format("◈◈◈◈◈◈◈◈◈◈"), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("◇◇◇◇◇◇◇◇◇◇"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
◇◈
concat(slice(format("●●●●●●●●●●"), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("◌◌◌◌◌◌◌◌◌◌"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")
▢▣
concat(slice(format("▣▣▣▣▣▣▣▣▣▣"), 0, floor(10 * prop("Done Items") / prop("Total Items"))) + slice(format("▢▢▢▢▢▢▢▢▢▢"), 0, ceil(10 * prop("Incomplete Items") / prop("Total Items"))) + " " + format(if(round(100 * prop("Done Items") / prop("Total Items")) > 100, 100, round(100 * prop("Done Items") / prop("Total Items")))) + "%")

//bar display options

//color bar display options
⚫🟢

⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫
🟢🟢🟢🟢🟢⚫⚫⚫⚫⚫
🟢🟢🟢🟢🟢🟢🟢🟢🟢🟢

🤍💗
🤍🤍🤍🤍🤍🤍🤍🤍🤍🤍
💗💗💗💗🤍🤍🤍🤍🤍🤍
💗💗💗💗💗💗💗💗💗💗

💠🔶
💠💠💠💠💠💠💠💠💠💠
🔶🔶🔶🔶🔶💠💠💠💠💠
🔶🔶🔶🔶🔶🔶🔶🔶🔶🔶

⭕🔴
⭕⭕⭕⭕⭕⭕⭕⭕⭕⭕
🔴🔴🔴🔴⭕⭕⭕⭕⭕⭕
🔴🔴🔴🔴🔴🔴🔴🔴🔴🔴

💢💥
💢💢💢💢💢💢💢💢💢💢
💥💥💥💥💢💢💢💢💢💢
💥💥💥💥💥💥💥💥💥💥

💫🧙‍♂️
💫💫💫💫💫💫💫💫💫💫
🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️🧙‍♂️

//black and white bar display options
◇◈

◇◇◇◇◇◇◇◇◇◇
◈◈◈◈◈◈◇◇◇◇
◈◈◈◈◈◈◈◈◈◈

◌●
◌◌◌◌◌◌◌◌◌◌
●●●●●◌◌◌◌◌
●●●●●●●●●●

▢▣
▢▢▢▢▢▢▢▢▢▢
▣▣▣▣▢▢▢▢▢▢
▣▣▣▣▣▣▣▣▣▣