HTML Brick Pattern Tool

Today I threw together a super-quick little HTML tool for arranging bricks in patterns. Then I iterated on it, twice, and ended up with the current "v3" version. To use it, go here and click on "Brick Pattern Creator".

The first version was a fixed-size grid, and was very slow to use (you had to click each grid square multiple times to cycle through the colours, and then right-click each square multiple times to cycle the "border orientation", and then repeat for the second half of the brick; so to make a single red 20cm x 10cm brick you had to click like 10 times), but the current one is MUCH smoother and faster. You click on the colour name to switch to that colour, and click on a square then drag onto the neigbor and release to join them into a brick. So a single brick is now one click and drag. The grid size is also variable, and it counts the total number of each colour.

Honestly, I'm quite proud of how it came out for something that I spent less than a day on. If I was going to spend any more time on it I would like to have it keep applying colours and joining squares if you keep the mouse down and keep dragging. Of course there's other refinements I can think of, like allowing more than just the four hard-coded brick colours. But I'm unlikely to spend any more time on it, as I've already finished what I needed it for.