Alg0.dev
alg0.dev is an interactive algorithm visualizer where classic algorithms come to life through step by step animations, controls to pause or advance, and access to the underlying code.
Install / Use
/learn @midudev/Alg0.devREADME
alg0.dev
Visualize, understand and master algorithms
Learn algorithms and data structures interactively. Step-by-step visualizations, real-time code highlighting and detailed explanations. All in your browser, no setup needed.
</div>What is alg0.dev
A free, interactive web tool to learn algorithms through animated step-by-step visualizations. Every algorithm includes:
- Animated visualization — watch how the data structure transforms at each step
- Active line highlighting — code highlights in sync with the animation
- Variable tracking — see the state of every variable in real time
- Contextual explanation — understand the why behind each operation
40+ algorithms across 8 categories
<table> <tr> <td width="25%" valign="top">Sorting
Bubble Sort · Selection Sort · Insertion Sort · Quick Sort · Merge Sort · Heap Sort · Counting Sort · Radix Sort · Shell Sort
</td> <td width="25%" valign="top">Data Structures
Stack · Queue · Linked List · Hash Table · Binary Search Tree · Heap
</td> <td width="25%" valign="top">Graphs
BFS · DFS · Dijkstra · Prim · Topological Sort
</td> <td width="25%" valign="top">Searching
Binary Search · Linear Search · Jump Search · Interpolation Search
</td> </tr> <tr> <td width="25%" valign="top">Dynamic Programming
Fibonacci · 0/1 Knapsack · LCS (Longest Common Subsequence)
</td> <td width="25%" valign="top">Backtracking
N-Queens · Sudoku Solver · Maze Pathfinding
</td> <td width="25%" valign="top">Divide & Conquer
Tower of Hanoi
</td> <td width="25%" valign="top">Concepts
Big O · Recursion · Two Pointers · Sliding Window · Memoization · Greedy vs DP · Space Complexity
</td> </tr> </table>Keyboard shortcuts
| Key | Action |
|:---:|:---|
| Space | Play / Pause |
| → | Next step |
| ← | Previous step |
| C | Code tab |
| E | Explanation tab |
Plus: speed control (5 levels), skip to start/end, and resizable panels.
Features
- Interactive — step through execution, adjust speed, go forward and backward
- Bilingual — available in English and Spanish
- Responsive — works on mobile, tablet and desktop
- Accessible — keyboard navigation, screen reader support, respects
prefers-reduced-motion - Built-in code editor — Monaco Editor with syntax highlighting and custom dark theme
- No sign-up — open your browser and start learning
Stack
Built with Astro + React + Tailwind CSS + Monaco Editor.
License
MIT — created by @midudev
