💡 [Feature]: Add Quick Sort Visualizer

[ruhelamahi7-code]

❓ Problem Statement

Currently, the project only includes a Bubble Sort Visualizer
for teaching/demonstrating sorting algorithms. Quick Sort is
one of the most important and widely asked sorting algorithms,
but there's no interactive way for users to visualize how it
works within this project.

🚀 Proposed Enhancement

Add a Quick Sort Visualizer project following the same
UI/UX pattern as the existing Bubble Sort Visualizer, so users
can interactively see how Quick Sort partitions and sorts
an array step by step.

🛠️ Suggested Implementation

• Reuse the existing UI structure (input field, speed slider,
  animated bar chart, stats row, result display)
• Highlight the pivot element in a distinct color during
  partitioning
• Use different colors for: Pivot / Comparing / Swapping / Sorted
• Track and display comparisons and swaps count, similar to
  Bubble Sort Visualizer
• Add a new file web-app/js/projects/quick-sort.js with:
  • getQuickSortHTML() — UI template
  • initQuickSort() — sorting logic + animation
• Register the new project in web-app/js/projects.js:
  • Add to getProjectHTML() map
  • Add to initializers map

---

• I am a registered GSSoC 2026 contributor.
• I would like to implement this feature myself.

[github-actions]

⚠️ Important Contribution Guideline

Please do not open a Pull Request without being assigned to this issue first.

Please do not open a Pull Request without being assigned to this issue first.

How to proceed:

1. Comment on this issue to express interest
2. Wait for maintainers to assign you to the issue
3. Once assigned, you can start working on the PR
4. Include the assignment in your PR checklist

Thank you for helping us maintain a smooth workflow! 🙏

[ruhelamahi7-code]

Hi @steam-bell-92! 👋

I'd like to work on this feature! I have experience contributing
to this repo (previously fixed the Bubble Sort Visualizer's
HTML rendering bug in PR #1245).

I plan to follow the same UI/UX pattern as the Bubble Sort
Visualizer to build the Quick Sort Visualizer with pivot
highlighting and step-by-step animation.

Could you please assign this issue to me?
I'll submit a PR as soon as possible! 🚀

[Ekjyotkaur07]

hey @steam-bell-92 I'm a active GSSoC'26 contributor and would love to work on this issue. Kindly assign it to me.