Live
Rang
An interactive color-ordering game where players arrange Tailwind CSS color shades in the correct sequence. Features drag-and-drop mechanics, progressive difficulty levels, and a confetti celebration on completion.
- React
- TypeScript
- Vite
- Tailwind CSS
- Game
- Side Project
Rang is a color puzzle game built around Tailwind CSS’s color palette. Players are given a set of shades from a color family and must arrange them in the correct order — lightest to darkest.
The game scales in difficulty across three levels: 3 shades, 6 shades, and 10 shades. Each round rotates to a different color family, keeping things fresh. Progress is tracked locally so you can pick up where you left off.
Built with React, TypeScript, and Vite. Dark mode supported.