Dat Pixel Editor - Simple free & Open Source pixel graphics editor for the web
I recently Open Sourced (MIT license) and published a revamped version of a project I started seven years ago, Dat Pixel Editor, an HTML5 pixel graphics editor that allows you to create icons, game sprites and other small pixel graphics images right within your web browser. All the icons used in the app were drawn with the app itself.
Since I do believe that decentralizing the internet is the future, it is published on Beaker Browser, one of my favorite decentral networks right now because it's really polished and so easy to use that as long as you know how to use a web browser, you can join the future of the web and get starting making and hosting websites without the need for any servers, without being beholden to any central authority.
You can view the app on Beaker using the URL: dat://dpe.hashbase.io
It is however also available on the plain old HTTP based internet, compatible with both Firefox and Google Chrome, at: https://dpe.hashbase.io
It doesn't have many features yet, but all the basics are there. Pencil, move, fill bucket, rectangle, circle, line and eraser tools. One neat feature is the two different undo modes. There is normal undo which you know from other apps, but also "Single pixel undo". Sometimes, especially when drawing contours, you do everything right but then your hand jerks and you have to do undo everything and start again. With single pixel undo, you can just undo your mistake, pixel by pixel and continue drawing from any position. The way this is implemented also lends itself really well to implement layers and even replaying the drawing of pictures as an animation in future releases of Dat Pixel Editor.
The decentralized version of Dat Pixel Editor stores images you draw in so called Dat archives. Beaker uses the Dat protocol, which is often described as Bittorrent 2.0 since it works very similar but offers additional features like versioning. A Dat archive is just a folder with some files you want to share and a dat.json file with metadata that describes the archive. This archive with all its files is then available decentralized via Peer-to-peer, hosted by yourself on your own computer and anyone who decides to share it. In the future, once Dat supports the upcoming "Multiwriter" feature, this will make it possible for you to sync your Dat Pixel Editor images with other computers over the internet, securely via peer to peer. Even drawing images together with other people remotely will become possible.
The HTTP based version stores images in IndexedDB right now, locally in your web browser. The app never connects to any server, so the pictures you draw are completely private. Originally, seven years ago it also synced with Google Drive, but for this release I've removed anything that connects to central services.
You can view the source code (plain JavaScript & jQuery) here: https://github.com/cryptowyrm/datpixeleditor
Feel free to submit bug reports and feature requests on Github: https://github.com/cryptowyrm/datpixeleditor/issues
And if you're a developer you're also very welcome to send in pull requests with improvements. The code is very simple since I was a JavaScript beginner when I wrote it seven years ago, I updated it a bit to make use of new JavaScript syntax and use the newest jQuery release. You don't have to be a JavaScript pro to help write code, I rarely use JavaScript myself and prefer ClojureScript, so don't worry that I'll bite your head off for less than optimal code. Let's just have fun writing something cool together. If there are problems with your code, I'll explain them and do my best to work together with you to improve it for inclusion in the project.