Dragon Gems 💎🐲

A Camp Guru–style logic puzzle for young kids (about 7). Instead of trees and tents, baby dragons need gems.

Rules

1. Every dragon gets one gem right next to it (up, down, left or right).
2. Gems are shy: they never touch, not even at the corners.
3. The numbers show how many gems go in each row and column.

Tap a square once for a gem 💎, twice for a bush 🌿 (meaning "no gem here"), and a third time to clear it.

Features

• An interactive tutorial with Pip the pixie (it can read the words out loud)
• 3 worlds with 10 levels each: Crystal Cave (4×4), Treasure Island (5×5), Dragon Mountain (6×6)
• Every puzzle has exactly one solution. Levels are generated from fixed seeds, so they're the same every time.
• Magic Puzzles unlock after all 30 levels: brand new random puzzles on 4×4 to 8×8 boards, as many as you like
• Hints, undo, star ratings (3 ⭐ = no hints), sounds and confetti
• Progress is saved in the browser (localStorage)

Run locally

It's plain HTML/CSS/JS with no build step:

python -m http.server 5173

Then open http://localhost:5173.

Deploy to Vercel

Push this folder to GitHub and import it in Vercel with Framework Preset Other and no build command. You can also run npx vercel from this folder.

Tweaking

• Level sizes, gem counts and world names: WORLDS in js/main.js
• Magic Puzzle sizes and dragon counts: FREE_SIZES in js/main.js; the unlock rule is freeOpen()
• Tutorial script: STEPS in js/main.js
• Puzzle generator and solver: js/puzzle.js