It seems as if there's only 1 undo available when clicking on the face under the dump truck. Can there be more undos?

Ref impl: keeps previous submenu selection when going between tools.

e.g. If I'm on caterpillar tool, then go to eraser tool, then back to the brush, it should still be the caterpillar tool.

Sound on Safari isn't working as intended.

Ref impl: Always puts a drip at first mouse down, random time based intervals follow. Drip size same. Drip length randomly varies from 0 to 16px. Line width 5px. Modifier key makes drip longer.

For cross browser support you need to add both of these properties:

image-rendering: crisp-edges; 
image-rendering: pixelated;

Your sample image

It seems to me that this is drawing two strokes at once.

1. solid line
2. dither highlight

More Examples

Here are two ovals:

1. left: drawn clockwise
2. right: drawn anti-clockwise

These were drawn starting/ending at the 12 o'clock position,
but the result is the same regardless of starting/ending position.

Notes

• they are diagonally mirrored along the line top-left to bottom-right

Here are some horizontal and vertical lines:

1. drawn upwards (bottom to top)
2. draw downwards (top to bottom)
3. drawn rightwards (left to right)
4. drawn leftwards (right to left)

Here are some diagonal lines:

1. drawn upwards to left (bottom to top)
2. draw downwards to right (top to bottom)
3. drawn upwards to right (bottom to top)
4. draw downwards to left (top to bottom)

Notes

• 1 & 2 are "opposite" (let's say of widths 0 and 1)
• 3 & 4 are "identical" (let's say both of width 2)

A reproduction of your ornate shape:

• drawn starting from A and ending at B

My educated guess

Here's how I think it does it:

1. draw the solid stroke
2. set size of the dither stoke according to direction (delta from last draw)
3. draw the dither stroke up-left a few pixels

Size of dither stroke

• up/left decreases the size
• down/right increases the size

But from what default values?
And by what factor?

I'd have to experiment with code to figure out the details.

Not sure how you're drawing the lines, but I doubt they have anti-aliasing in the original.

For my app I created my own line drawing function which draws a rectangle at each point in the line: https://github.com/lospec/pixel-editor/blob/master/js/_drawLine.js

Apologies if this is a silly question but we could not figure out how to start a new drawing. Is there a user manual that talks about this?

Great implementation, thanks for the memories!
Noticed something with the "Texture ?" circle tool where the rainbow "spread" isn't evenly distributed based on the cursor draw angle.
Here are 5 circles in order from left to right, line added for visual axis of drag path:

• Dragged from top to bottom (0 degrees)
• Dragged from left-center top (30 degrees)
• Dragged from top left (45 degrees)
• Dragged from upper-left (60 degrees)
• Dragged from left to right (90 degrees)

Latest Linux Firefox for the record. (and assuming this isn't a bug in the original)

The characters should probably be centered within the buttons you push to select the letters? In Firefox they are quite badly off-center and in Chromium they are better, but still sitting on the bottom edge of the button.

Firefox:

Chromium:

The fuzzer tool deletes anything created by the wacky brush that was not "fuzzed"

I noticed while playing around with the software that trying to draw with a finger or stylus on the Surface Pro causes the drawing tool to be placed to the upper left of the mouse location by a considerable distance.
This issue does not occur when selecting tools/colors or when drawing with the mouse.
I can provide pictures or videos later if that would be helpful. Thank you very much!

It's hard to reproduce, but when using the lollipop tool a few times, it accidentally wipes the entire canvas. I believe this is a bug.

Video:
https://recordit.co/OOhU99msZ3

It looks like the app uses some type of persistence to keep your work if you close the tab or window, but this is conflicting with the firecracker tool if the user exits mid-explosion:

Steps to reproduce:

1. Create a masterpiece
2. Select firecracker tool from eraser menu
3. Apply firecracker to canvas, starting animation sequence
4. Close the browser tab or window before the animation sequence completes
5. Reopen browser tab or window

Possible solution: clearing the persistence state at the start of the firecracker animation sequence?

Meta+Letter used to contain a font-selector and typewriter-like tool. Allowed for font re-selection. Did not allow for re-editing once "done."

Ref impl:

Ref impl: inverts circles underneath. Todo: count how many circles trail the tool.

Hi! The background looks white in my browser (Firefox on MacOS) but when I save the image to my computer, it looks gray instead. If I specifically color an area white, then that area also looks white in the saved image. See images below to see the issue more clearly. Thanks!

Looper tool is broken. Ref impl:

The tablet I'm trying to use is a XP-PEN pen tablet. All web app versions don't detect when I try to draw, but it does detect clicks on tools. Instead of drawing, the canvas starts scrolling in the direction I'm trying to draw. The problem doesn't seem to be the tablet, since other apps are detecting strokes.

EDIT: the problem seems to be with firefox? Strange since aggie works on firefox... but when I use edge the program works fine, although the strokes are in a different place from my pen.

The wrong spray paint (from Kiddopaint) implementation is in the app. Switch to correct one:

Kid Pix JS Output:

Expected Output:

nice to meet you

Considering using the web version within the facility
Can I get permission to use

I'm happy that "Kid Pix", which I used when I was a child, has been revived.

I want to draw stuff but it's hard when I can't change the canvas size. It's too big.