LOGIC PUZZLE
Nonogram online free
The numbers along the edges tell you how many squares to fill. You work out the rest. Grids from 5×5 to 25×25, generated on the spot and guaranteed solvable by pure logic: no guessing, ever. Plays in the browser, no sign-up and nothing to install.
Mouse: left click fills, right click marks empty, drag to fill a run. Touch: use the ■ and ✕ buttons to pick the tool. Spacebar swaps between them.
How to play
Every row and every column carries a sequence of numbers. Those numbers are the consecutive blocks of filled squares, in the order they appear, separated by at least one empty square.
A row of 10 with the clue 4 2 holds a block of four filled squares, then at least one empty, then a block of two. Exactly where they sit is decided by the crossing constraints from the columns. When a row or column is complete its clue dims, so you can see at a glance what is left.
Three techniques that solve almost everything
Overlap
This is the opening move. On a row of 10 with the clue 8, push the block all the way left, then all the way right: the squares filled in both positions are certainly filled. With 8 out of 10 that leaves 6 certain squares in the middle, without yet knowing where the block starts. The larger the number relative to the line, the more squares it hands you.
Closing from the edges
A filled square sitting against the edge pins down the block that contains it: if the first square is filled and the clue starts with 3, the first three are filled and the fourth is empty. The same holds mirrored from the other end. Edges are always the place to restart from when you get stuck.
Mark the empties
The most common mistake is marking only the filled squares. Crosses are worth as much as fills: they break the line into shorter segments, and a segment too short to hold the next block rules itself out. People who solve fast mark the empties as diligently as the fills.
The options
- Size — from 5×5 for a one-minute break to 25×25 for a long sitting.
- Lives — 3, 5 or unlimited. On unlimited a mistake is still flagged, but it costs nothing.
- Flag mistakes — switch it off and the game stops telling you a square is wrong: checking goes back to you, which is how nonograms are played on paper.
- Auto crosses — when a row or column is complete, the remaining squares mark themselves.
- Hints — reveal one random square among those still undone.
- Resume — the game saves itself: close the tab and find it where you left it.
Frequently asked questions
Is the nonogram free?
Yes, it plays free in your browser. There is no sign-up, no account, no advertising and no data collection: the whole game runs on your device.
What is the difference between nonogram, picross and griddler?
None: they are three names for the same puzzle. «Nonogram» is the name used in mathematical circles, «Picross» comes from the Nintendo series, «griddler» is the term the British press adopted. The rules are identical.
Are the grids always solvable by logic?
Yes. Every grid is run through a solver before being served: if it does not close by reasoning row by row and column by column, it is thrown away and another one is generated. You never have to guess.
Does it work on a phone?
Yes. The ■ and ✕ buttons pick the tool, dragging fills several squares in a row, and the − and + buttons adjust the grid zoom, which helps on the larger sizes.
Is progress saved?
Yes. The game in progress is kept in your browser's local storage, so you can close the tab and pick up where you left off: grid, marked squares, lives and elapsed time. The save never leaves your device, is never sent to any server, and is dropped once the game ends.
How it is built
The game is a single page, no libraries and no backend: hand-written HTML, CSS and JavaScript, roughly 20 KB in total. The interesting part is the generator.
Generating a random grid is trivial; generating one that is solvable by reasoning is not. The generator draws a random solution, computes its clues, then tries to solve it back with a dynamic-programming line solver that works out, for each row and column, which squares are certain. The loop runs until the grid closes or no more information can be gained: in the second case the grid is discarded and it starts over. Only what pure logic can crack survives.
It comes out of the same way of working I apply to products: Miraviso is a real case, and if you need a hand with something similar, start here.