Mahjong Garden: free the tiles, fill the tray, clear the garden.
Mahjong Garden is an HTML5 tile-matching puzzle template with full source code. Players tap a tile that no other tile covers, it flies to a tray of seven slots, and three alike disappear. The edition has 60 levels in four seasonal worlds, a guided tutorial, three helpers, 14 interface languages and a ready-to-host game folder.
Four worlds, sixty levels
Spring Garden, Sunny Pond, Autumn Orchard and Snowy Garden each bring their own scenery, 12 tile pictures, a level map with a stop for every level and a weather effect: petals, bubbles, falling leaves or snow. The mole mascot changes outfit with the season. Levels grow from 9 tiles to 90 tiles, and every level is generated from a stored solution, so it can always be won.
Made to feel good
Tiles fly to the tray in a little arc, the tray dips as they land, a match bursts into sparkles, petals and coins, and quick matches in a row raise the pitch of the sound. Every tap on the interface gives a small shower of stars, screens change with an animated iris transition, and the mole reacts to what you do. Everything respects the reduced-motion setting of the device.
Helpers, coins and a guided tutorial
Undo takes back a move, Hint points at a trio you can make and Shuffle rearranges what is left while keeping the level solvable. Coins come from every match and win, and each level awards up to three stars. Level 1 teaches the game in seven short steps, every time it starts.
14 languages, every screen size
The interface is translated into 14 languages and starts in the language of the device. The game runs in portrait and landscape on phones, tablets, desktops and ultra-wide screens: in landscape on a phone the tray moves to the side. It works in all current browsers, including Chrome, Edge, Firefox and Safari on iPhone and iPad, with a "Tap to start" screen that unlocks sound on mobile.
Your game, your hosting
Upload the contents of the game folder to static HTTP(S) hosting and open index.html. No database, PHP, account, server or Node.js runtime is needed, and normal play makes no requests to ranking, advertising or payment services. Artwork, audio and the font are all local. The package includes the editable project, an illustrated offline guide in English, Portuguese and Spanish and the font licence notice.
What this edition does not include
Native apps, hosting and custom development are not included, nor are online multiplayer, an online ranking, in-app purchases or an advertising SDK. The included translations are supplied as they are: have a native speaker review them before launching in a new market.
Who this template is for
Site and portal owners who want a polished casual puzzle, freelancers and studios who need a base for a client's branded tile game, and developers who want to learn from readable JavaScript modules.
Customise it
Change the world list, helpers, coin values and game-feel numbers in src/config.js, the tile count of each level in src/game/levels.js and the texts of all 14 languages in src/i18n.js. Screens and systems live in small files in src/app/, each with a one-line description at the top. The stylesheets are layered in four files: edit the last one that sets a rule. Replace artwork, sounds and music by dropping files with the same names into assets/.
Technical details at a glance
- Stack: HTML5, plain JavaScript modules and CSS, Canvas 2D and Web Audio, with no third-party code and no game engine.
- Files: HTML, CSS, JavaScript, JSON, SVG, WebP, MP3 and WOFF2.
- Languages: 14 interface languages and a guide in English, Portuguese and Spanish.
- Browsers: Chromium-based browsers 105+, Firefox 121+, Safari 16+, desktop and mobile.
- Saves: the browser's local storage, with no account or cloud sync.
- Tests: npm test checks the rules of all 60 levels and the 14 languages. Node.js 26.13 or newer is only used for the tests, the local server and the copy command.
