Please, enter a valid email!
00 days
:
00 hours
:
00 minutes
:
00 seconds

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

Canvas-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

canvas 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

canvas-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.



Don’t miss out these all-time favourites

  1. The best hosting for a WordPress website. Tap our link to get the best price on the market with 30% off. If Bluehost didn’t impress you check out other alternatives.
  2. Website Installation service - to get your template up and running within just 6 hours without hassle. No minute is wasted and the work is going.
  3. ONE Membership - to download unlimited number of WordPress themes, plugins, ppt and other products within one license. Since bigger is always better.
  4. Ready-to-Use Website service is the ultimate solution that includes full template installation & configuration, content integration, implementation of must-have plugins, security features and Extended on-page SEO optimization. A team of developers will do all the work for you.
  5. Must-Have WordPress Plugins - to get the most essential plugins for your website in one bundle. All plugins will be installed, activated and checked for proper functioning. 
  6. Finest Stock Images for Websites - to create amazing visuals. You’ll get access to Depositphotos.com to choose 15 images with unlimited topic and size selection.
  7. SSL Certificate Creation service - to get the absolute trust of your website visitors. Comodo Certificate is the most reliable https protocol that ensures users data safety against cyber attacks. 
  8. Website speed optimization service - to increase UX of your site and get a better Google PageSpeed score.


Edward Korcheg

Edward is a professional technical writer who is also passionate about making stunning designs in Photoshop. You can find many useful tutorials in his collection of articles at MonsterMost.

Get more to your email

Subscribe to our newsletter and access exclusive content and offers available only to MonsterPost subscribers.

From was successfully send!
Server error. Please, try again later.

4 responses to “HTML5-Based Graphic Apps and Sketching Tools”

  1. Learnphp says:

    To learn PHP,mysql,ajax,html,javascript,jquery with advanced concepts, you can visit Advanced PHP tutorial

  2. Thomas says:

    Also, sort of hackerish, but there is Skibble

  3. getnaked says:

    Spirograph is very cool app =)

Leave a Reply

Your email address will not be published. Required fields are marked *