Colorful Notion Progress Bars

20 Custom & Colorful Notion Progress Bar Formulas

Explore ready-to-use aesthetic progress bar formulas designed for dashboards, goal tracking, and life planners. No setup required — just copy and paste.

Red Loading Progress Bar

██████░░░░ 60%

Copy the Notion formula:

"█".repeat(min(10, floor(Done / Total * 10))).style("red") + "░".repeat(10 - min(10, floor(Done / Total * 10))).style("red") + " " + format(floor(Done / Total * 100)) + "%"

Yellow Circle Center Dot

◉◉◉◉◉◉◎◎◎◎ 60%

Copy the Notion formula:

"◉".repeat(min(10, floor(Done / Total * 10))).style("yellow") + "◎".repeat(10 - min(10, floor(Done / Total * 10))).style("yellow") + " " + format(floor(Done / Total * 100)) + "%"

Blue Large Dot

⬤⬤⬤⬤⬤⬤◯◯◯◯ 60%

Copy the Notion formula:

"⬤".repeat(min(10, floor(Done / Total * 10))).style("blue") + "◯".repeat(10 - min(10, floor(Done / Total * 10))).style("blue") + " " + format(floor(Done / Total * 100)) + "%"

Green Medium Square Bar

■■■■■■□□□□ 60%

Copy the Notion formula:

"■".repeat(min(10, floor(Done / Total * 10))).style("green") + "□".repeat(10 - min(10, floor(Done / Total * 10))).style("green") + " " + format(floor(Done / Total * 100)) + "%"

Black Triangle

▲▲▲▲▲▲△△△△ 60%

Copy the Notion formula:

"▲".repeat(min(10, floor(Done / Total * 10))).style("black") + "△".repeat(10 - min(10, floor(Done / Total * 10))).style("black") + " " + format(floor(Done / Total * 100)) + "%"

Pink Vertical Bar

▌▌▌▌▌▌▯▯▯▯ 60%

Copy the Notion formula:

"▌".repeat(min(10, floor(Done / Total * 10))).style("pink") + "▯".repeat(10 - min(10, floor(Done / Total * 10))).style("pink") + " " + format(floor(Done / Total * 100)) + "%"

Orange Stars

★★★★★★☆☆☆☆ 60%

Copy the Notion formula:

"★".repeat(min(10, floor(Done / Total * 10))).style("orange") + "☆".repeat(10 - min(10, floor(Done / Total * 10))).style("orange") + " " + format(floor(Done / Total * 100)) + "%"

Purple Small Circle

⬢⬢⬢⬢⬢⬢◌◌◌◌ 60%

Copy the Notion formula:

"⬢".repeat(min(10, floor(Done / Total * 10))).style("purple") + "◌".repeat(10 - min(10, floor(Done / Total * 10))).style("purple") + " " + format(floor(Done / Total * 100)) + "%"

Brown Square Dotted

▣▣▣▣▣▣□□□□ 60%

Copy the Notion formula:

"▣".repeat(min(10, floor(Done / Total * 10))).style("brown") + "□".repeat(10 - min(10, floor(Done / Total * 10))).style("brown") + " " + format(floor(Done / Total * 100)) + "%"

Gray Minimal Dash Bar

▰▰▰▰▰▰▱▱▱▱ 60%

Copy the Notion formula:

"▰".repeat(min(10, floor(Done / Total * 10))).style("gray") + "▱".repeat(10 - min(10, floor(Done / Total * 10))).style("gray") + " " + format(floor(Done / Total * 100)) + "%"

Red Diamond Symbol

◆◆◆◆◆◆◇◇◇ 60%

Copy the Notion formula:

"◆".repeat(min(10, floor(Done / Total * 10))).style("red") + "◇".repeat(10 - min(10, floor(Done / Total * 10))).style("red") + " " + format(floor(Done / Total * 100)) + "%"

Yellow Big Circle Dot (No Tails)

⬤⬤⬤⬤⬤⬤ 60%

Copy the Notion formula:

"⬤".repeat(min(10, floor(Done / Total * 10))).style("yellow") + "◯".repeat(10 - min(10, floor(Done / Total * 10))).style("yellow") + " " + format(floor(Done / Total * 100)) + "%"

Blue Hexagon Symbol

⭓⭓⭓⭓⭓⭓⭔⭔⭔⭔ 60%

Copy the Notion formula:

"⭓".repeat(min(10, floor(Done / Total * 10))).style("blue") + "⭔".repeat(10 - min(10, floor(Done / Total * 10))).style("blue") + " " + format(floor(Done / Total * 100)) + "%"

Green Shaded Square Symbol

▧▧▧▧▧▧□□□□ 60%

Copy the Notion formula:

"▧".repeat(min(10, floor(Done / Total * 10))).style("green") + "□".repeat(10 - min(10, floor(Done / Total * 10))).style("green") + " " + format(floor(Done / Total * 100)) + "%"

Black Square With Spacing

◾◾◾◾◾◾□□□□ 60%

Copy the Notion formula:

"◾ ".repeat(min(10, floor(Done / Total * 10))).style("black") + "□ ".repeat(10 - min(10, floor(Done / Total * 10))).style("black") + " " + format(floor(Done / Total * 100)) + "%"

Pink Diamond Bar

❖❖❖❖❖❖⟐⟐⟐⟐ 60%

Copy the Notion formula:

"❖".repeat(min(10, floor(Done / Total * 10))).style("pink") + "⟐".repeat(10 - min(10, floor(Done / Total * 10))).style("pink") + " " + format(floor(Done / Total * 100)) + "%"

Orange Check Marks (No Tails)

✓✓✓✓✓✓ 60%

Copy the Notion formula:

"✓".repeat(min(10, floor(Done / Total * 10))).style("orange") + "".repeat(10 - min(10, floor(Done / Total * 10))).style("orange") + " " + format(floor(Done / Total * 100)) + "%"

Purple Moon (No Tails)

☾☾☾☾☾☾ 60%

Copy the Notion formula:

"☾".repeat(min(10, floor(Done / Total * 10))).style("purple") + "".repeat(10 - min(10, floor(Done / Total * 10))).style("purple") + " " + format(floor(Done / Total * 100)) + "%"

Brown Shadowed Square (No Tails)

❑❑❑❑❑❑ 60%

Copy the Notion formula:

"❑".repeat(min(10, floor(Done / Total * 10))).style("brown") + "".repeat(10 - min(10, floor(Done / Total * 10))).style("brown") + " " + format(floor(Done / Total * 100)) + "%"

Gray Halfmoon Symbol (No Tails)

◐◐◐◐◐◐

Copy the Notion formula:

"◐".repeat(min(10, floor(Done / Total * 10))).style("gray") + "".repeat(10 - min(10, floor(Done / Total * 10))).style("gray") + " " + format(floor(Done / Total * 100)) + "%"

Notion Life Planner Template

Tired of scattered to-dos and losing track? Organize your daily tasks, plans, goals, habits, journal, learning, bookmarks, reading, and more—all in one place!

View this template