Ms Paint Online Free

A near pixel-perfect copy of Microsoft Paint in HTML, CSS and JavaScript, using the tag as specified by WHATWG and supported by Safari 1.3, Firefox 1.5 and Opera 9. This web app is not authorized by, supported by or in any way affiliated with Microsoft.
Behold MS Paint online. It is an easy to use web-based application, the look and feel of which is exactly like MS Paint. Not only that, the user interface of MS Paint online resembles the version of MS Paint used in older versions of windows.

2010 Update

This experiment dates from 2006. I (@c3o) moved on to create tumblelogging / lifestreaming startup Soup.io.
The CanvasPaint code (messy as it is) has been released into the public domain. Information below might be outdated. Thanks for visiting!

Originally intended as a free replacement for the Microsoft Paint software that comes with Windows, it has grown into a powerful yet simple image and photo editor tool. It has been compared to other digital photo editing software packages such as Adobe ® Photoshop ®, Corel ® Paint Shop Pro ®, Microsoft Photo Editor, and The GIMP.

What's this?

A near pixel-perfect copy of Microsoft Paint in HTML, CSS and JavaScript, using the <canvas> tag as specified by WHATWG and supported by Safari 1.3, Firefox 1.5 and Opera 9.
This web app is not authorized by, supported by or in any way affiliated with Microsoft.

Visit the blog

Why didn't you do this in ___?

The primary goal wasn't to build a painting web app, but to experiment with <canvas>.

Things to try out

Holding down ctrl for a tertiary color, shift for line/shape constraints, ctrl+a/c/x/z, dragging and resizing the window, resizing the canvas..

Can I save my drawings?

Yes, but only in Firefox 2 and Opera 9.
To save an image to your hard drive, use File > Download. To save it on this server, use File > Save online. Your image will be assigned a URL which you may share or embed elsewhere, and it may be publically shown here. However, no guarantees are given as to its future availibity: I reserve the right to delete images at any time.

I always get the context menu when attempting to use the secondary color

Ms Paint Free Online 2020

Allow scripts to disable context menus. To do this in Firefox, check 'disable or replace context menus' in Options > JavaScript: Advanced..

Why doesn't feature X work?

Some features are only supported by certain browsers:

Color picker: Firefox 2.0; Opera 9
Flood fill: Opera 9
Save image: Firefox 2.0; Opera 9
Open URL: Firefox 1.5; Opera 9; Latest WebKit

So is `<canvas>` useful?

Yes, for applications that do not require cross browser support, such as OS X desktop widgets or Firefox extensions and XUL apps. For drawing apps, the biggest problem is that you're limited by the refresh rate of the mousemove event to find the position of the cursor. This is especially noticable with the airbrush tool, while I try to hide it with the pen and brush tools by automatically smoothing the created path.
Other shortcomings: Gets very slow at large sizes (both actual high resolution and CSS-sized), no getPixel(), several bugs and missing features in Firefox 1.5.
Interesting features not used here: Transparency.

Technical notes

This demo uses 5 <canvas>es: the obvious one, one transparently layered on top for previews while drawing shapes and lines, a hidden one used as a clipboard for saving selections, another hidden one saving the last undo state, and the gradient in the title bar.
The cursors make use of another Firefox 1.5 feature: CSS3 cursor URLs.

Other people's experiments

Canvascape 3D
Mandelbrot fractals
CanvasGraph
Image reflections
Canvas Painter

Online Ms Paint Tool

Dear Microsoft

Dr.fone. Please don't sue me. Kthx.