The canvas element is a new HTML DOM element on which you can draw and animate shapes. The canvas tag is part of the new HTML5 standard (draft) but is already implemented in several browsers. Originally developed by Apple for it's "Dashboard", the canvas element was quickly adopted by Safari then FireFox. As usual, Internet Explorer ignored it, although IE9 should support the HTML5 standard including the canvas element.
Using the canvas element is quite simple. Just place the canvas tag in your HTML page like you would any other tag. Any markup between the opening and closing tags will be displayed on browsers which are not compatible. Once the canvas is inserted into your document, you can access it via javascript.
The purpose of this site is to give you a basic introduction to the capabilities of the canvas element. Using the menu to your left, you can find information, examples and syntax on most canvas methods. Much of this is under construction, so bear with me. To give you some idea of what you can do with the canvas element, take a look at the simple "Snake" clone below. If you have ever had a Nokia phone, you've probably spent too much time playing this game.
The snake demo is very crude, but is a good way to get to grips with the basics. Hit the play button then use the "w","a","s","d" keys to control the snake.