Color Route is a colorful route-connection puzzle game where players must connect matching colored endpoints by drawing paths across a network of roads. Each level challenges players to find the correct routes, avoid occupied paths, and connect every color pair to complete the puzzle.

With 50 progressively challenging levels, procedurally generated boards, and a simple drag-based control system, Color Route offers an enjoyable logic-puzzle experience on desktop and mobile devices.

Main Features

50 Progressive Levels:* Unlock and complete 50 puzzle levels.
Procedurally Generated Boards:* Each level generates a board with a guaranteed valid solution.
Multiple Colors:* Connect matching endpoint pairs using different colors.
Increasing Difficulty:* Board dimensions and route complexity increase as levels progress.
Interactive Route Drawing:* Drag between connected points to create routes.
Undo by Dragging Back:* Move backward along your current route to undo steps.
Hint System:* Use the built-in hint button to reveal an unfinished route. Two hints are provided per level.
Level Selection:* Access previously unlocked levels through the level menu.
Progress Saving:* Unlocked level progress is saved using browser local storage.
Sound Effects:* Procedurally generated audio feedback with a mute option.
Animated Effects:* Colorful route highlights, endpoint animations, and victory particles.
Responsive Canvas:* Scales the puzzle board to fit the available screen space.
Preloader and Start Screen:** Includes a loading animation and Play Now button.

How to Play

Select an available puzzle level.
Find two endpoints with the same color.
Press or touch a colored endpoint and drag along the connected roads.
Follow the available paths until you reach the matching endpoint.
Connect every color pair to complete the level.
If you make a mistake, drag backward along your current route to undo steps.
Use a hint when you need help finding a route.

Controls

Desktop

Mouse click and drag to draw routes.
Drag backward to undo the current route.
Use the on-screen buttons to restart, select levels, open instructions, toggle sound, or use hints.

Mobile

Touch and drag to connect matching colors.
Use the on-screen controls for the available game actions.

Technical Details

Game Type: Logic Puzzle / Color Connection
Technology: HTML5, CSS3, JavaScript, Canvas 2D
Rendering: HTML5 Canvas
Input: Pointer Events (mouse and touch)
Audio: Web Audio API
Progress Storage: Browser local storage
External Game Engine: Not required
Level Generation: Procedural and deterministic per level number
Levels: 50
Hints: 2 per level

Browser Compatibility

Designed for modern versions of:

Google Chrome
Mozilla Firefox
Microsoft Edge
Safari

Color Route | Connect the Colors Puzzle HTML5 Game