HTML5-Based Graphic Apps and Sketching Tools

There is no doubt that the most intriguing new HTML5 tag is the canvas tag. Despite all controversial web discussions concerning this element it is obvious that canvas symbolizes the "semantic" web concept. Its aim is to simplify the process of rendering the 2D shapes and bitmap images. You may have seen a few "canvas" demos that already became viral on the web. As the result many developers and web designers have noticed that using the canvas tag is really effective and it saves much time.

Recent big news from the Google I/O conference showed us that the main market players admit HTML5 as a main perspective for the further development. Actually we hope that it will disctact us from all these media wars and that the social media world will expand a more useful information about new and interesting achievements of HTML5.

Today we have compiled some interesting applications and sketching tools that are build with the help of Java scripts and the "canvas" tag. These examples are only experiments but they're definitely worth checking out. (Don't forget that it would be better to browse all these application via Chrome or the latest versions of Opera and Firefox).

1. Spirograph

Spirograph is a geometric drawing toy that produces mathematical curves of the variety technically known as the hypotrochoids and epitrochoids (via WikiPedia). This example allows you to play with all kinds of parameters including size of mobile circle, static circle and so on.

* * *

2. Bomomo

Inspiring tool that will make you feel like a real artist even if you are not. Great painting application with original patterns and interesting options.

* * *

3. Tilt-Shift Photo Effect

Have you ever wondered how all those tilt-shift photos are made? This app will help you to know the magic of "toy" photography.

* * *

4. Content Aware Image Resizing

This is a really useful image tool that will help to keep the genuine size of images while resizing them. In other words the application calculates which parts of the image should and should not be resized.

* * *

5. Sketchpad

Sketchpad is a helpful online service for those who like simple and effective sketching tools. Contains set of most popular options (brush, pencil, fill and text items; tools for spirographs, unusual shapes and stamps).

* * *

6. Gartic

This is a drawing HTML5 program that has a pencil, eraser, line and shape tools, flood fill, colour picker and undo. Gartic also allows you to watch an animation and save it out as PNG, GIF or JPG.

* * *

7. WebDraw

Please meet a line drawing vector graphics application. It creates impressive "hand-drawn" effect and has a plenty of effective features that will enhance your sketch without a doubt.

* * *

8. Panning Navigator

Well everything is simple here - thanks to the canvas tag and JQuery you can easily pan large image or photo.

* * *

9. Iconza

This is a great icon builder powered by MooTools and canvas tag. You can choose color and size of your icon and use them absolutely for free.

* * *

10. PhysicSketch

PhysicSketch allows to draw items on the canvas and then hit a button to watch gravity take control.