The canvas element is part of HTML5 and allows for dynamic, scriptable rendering of 2D shapes and bitmap images. It is a low level, procedural model that updates a bitmap and does not have a built-in scene graph. Today we have collected 10 Extremely Impressive HTML5 Canvas Demos to show its potential.
HTML5 Canvas and Audio Experiment
The developers over at 9elements have done a mesmerizing experiment with Canvas and the audio support in HTML5. Try clicking on the bubbles, they represent various tweets about HTML5.
Canvas Cycle: True 8-bit Color Cycling with HTML5
If you remember Color cycling from the 90s, it was a technology often used in 8-bit video games of the era, to achieve interesting visual effects by cycling (shifting) the color palette.
Liquid Particles
Liquid Particles is cool animation of 500 colored particles that you control by your mouse movements. It works on Google Chrome although, on my computer, Firefox and Safari handled it better.
HTML5 Video Destruction
Click video to blow it up!
The HTML5 logo – K3D demo in HTML5 Canvas and JavaScript (no Flash!)
The shiny new tongue-in-cheek HTML5 logo in glorious 3D!
Silk
Create your own generative art with Silk.
Harmony
Harmony is an HTML5-based online tool that lets you draw on a white canvas using different brushes.
deviantART muro
The creators of deviantART have embraced HTML5 within their new drawing application which uses the canvas element and allows their users to produce artwork in their browser.
Rumpetroll!
Rumpetroll is a beautiful multiplayer HTML5 demo. You take the role of a tadpole-like creature that can swim around and chat with other players. That’s pretty much all you can do at the moment so consider it just a glorified chatroom right now- but the game’s creators have hinted that there may be “more features to come.”
Darkroom
Darkroom is a comprehensive photo editor created entirely with HTML5 in the browser. It includes Photoshop-like features such as Brightness, Contrast and Saturation controls along with a number of filters which can be applied to the photo of your choice.
really useful info, I am struggling to learn HTML5 and to discover all its features 🙂