Chromaflow Pins

Chromaflow Pins is a pull-the-pin liquid physics puzzle built with Phaser 3.80 and vanilla JavaScript modules. Tap gold pins to tween them out, route falling droplets past routers and moving vessels, and fill every vial with the right color without spilling or contaminating. 30 levels with sequential unlock and instant local save - no build step, no dependencies.

Highlights

• 30 hand-built levels: funnels, gaps, router pins, zig-zag routes, disposal challenges and moving vessels that patrol their paths
• Satisfying pin mechanics - taps tween the pin out along its axis and deactivate its collision at the same moment
• Real liquid rules: contamination tolerance, white disposal liquid, uncollected-liquid limits - three distinct ways to lose
• Level helpers (vessel, emitter, funnel, routers, waste, reservoirs) make new levels a few lines of plain JS
• Headless test suite runs the exact same LiquidSystem the game uses and proves all 30 levels are winnable with scripted play
• Win, pause and level-select screens with progress saving to localStorage after every level
• SVG-generated textures, particle splashes and Web Audio synthesized sound - no asset files
• One-file re-skin: change the COLORS palette in config.js and the whole game follows (example re-skin screenshot included)

Technology

• Phaser 3.80.1 (bundled locally, no CDN), vanilla JavaScript ES modules
• Custom LiquidSystem simulation, independent of the renderer
• SVG texture factory for all artwork
• Web Audio API synthesis for all sound
• node --check syntax pass plus test/headless-sim.mjs solvability suite

Requirements

• Any static web server (a one-line python3 command is included) or any static host to publish
• Node.js only if you want to run the headless test suite
• Any modern browser - no accounts, no keys, 100% offline

What You Get

• Complete source: 5 scenes, entity/system architecture, liquid simulation and 30 level modules
• Level helper library with documented options (contamination tolerance, disposals, reservoirs, moving vessels)
• Headless physics + solvability regression suite
• documentation.html: running, interactions, structure, renaming, one-file re-skinning, level authoring, testing and publishing checklist
• README.md and 7 screenshots including a before/after re-skin example
• Full rights to rebrand, reskin, extend and publish anywhere

Please note: this is a source code template, not a hosted game. Basic JavaScript knowledge is helpful for customization. If you have questions, use the contact form on the site, I usually reply within 24 hours.