HTML <canvas> Tag

Description

The <canvas> HTML element creates an area in which using JavaScript you can draw different objects, display images, transform them and change properties. Using <canvas> you can create drawings, animations, games, etc.

Properties

Permitted Parents
Any element that accepts phrasing content
Content
Inline and text
Start/End Tags
Start tag: required, End tag: required

Example

<canvas id="canvasTest">Your browser does not support the HTML5 canvas tag.</canvas>
<script type="text/javascript">
var canvas=document.getElementById('canvasTest');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#800000';
ctx.fillRect(0,0,100,100);
</script>

Attributes

Attribute Definition
height Specifies the canvas height in pixels
width Specifies the canvas width in pixels

Global Attributes

The <canvas> tag also supports the Global Attributes in HTML5

Event Attributes

The <canvas> tag also supports the Event Attributes in HTML5

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
9Yes11.592
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
3718410.11Yes