YouTipMet Canvas Fill
# HTML canvas fill() Method
[ Canvas Object](#)
## Example
Draw a 150*100 pixel rectangle, then fill it with red color:
YourbrowserdoesnotsupporttheHTML5canvastag.
JavaScriptοΌ
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.rect(20,20,150,100);
ctx.fillStyle="red";
ctx.fill();
[Try it Β»](#)
* * *
## Browser Support
Internet Explorer 9, Firefox, Opera, Chrome, and Safari support the fill() method.
**Note:** Internet Explorer 8 and earlier versions do not support the element.
* * *
## Definition and Usage
The fill() method fills the current image (path). The default color is black.
**Tip:** Use the (#) property to fill with another color/gradient.
**Note:** If the path is not closed, the fill() method adds a line from the end of the path to the start to close it (just like [closePath()](#)), and then fills the path.
| JavaScript Syntax: | _context_.fill(); |
| --- |
* * Canvas Object](#)