HTML canvas fill() Method Last Updated : 09 Jun, 2023 Improve Improve Like Article Like Save Share Report The canvas fill() Method is used to fill the current drawing path. The default color of the canvas fill() method is black. Syntax: context.fill() Example-1: html <!DOCTYPE html> <html> <head> <title> HTML canvas fill() Method </title> </head> <body> <canvas id="GFG" width="500" height="300"> </canvas> <script> var x = document.getElementById("GFG"); var context = x.getContext("2d"); context.rect(50, 50, 350, 200); context.fill(); context.stroke(); </script> </body> </html> Output: Example-2: html <!DOCTYPE html> <html> <head> <title> HTML canvas fill() Method </title> </head> <body> <canvas id="GFG" width="500" height="300"> </canvas> <script> var x = document.getElementById("GFG"); var context = x.getContext("2d"); context.rect(50, 50, 350, 200); context.fillStyle = "green"; context.fill(); context.stroke(); </script> </body> </html> Output: Supported Browsers: Google Chrome Internet Explorer 9.0 Firefox Safari Opera Like Article Suggest improvement Previous HTML canvas clearRect() Method Next HTML canvas stroke() Method Share your thoughts in the comments Add Your Comment Please Login to comment...