How to Set the Color of HTML5 Canvas Text

In this article I have described how to set the color of Canvas Text in HTML5.
  • 2194

Canvas Text color in HTML5

  • Canvas element has a property to set the color of text in HTML5.
  • With the help of this properties we can set the color of canvas text.
  • This property in known as as "fillstyle" property of canvas context.


The syntax to set the property of canvas element


    context.fillStyle = 'red';


 Lets take an Example





        window.onload = function () {

            var canvas = document.getElementById("myCanvas");

            var context = canvas.getContext("2d");

            context.font = "40pt Verdana";

            context.fillStyle = "green";

            context.fillText("Welcome", 150, 200);






    <canvas id="myCanvas" width="578" height="200"></canvas>




 can clr.jpg

Further Readings

You may also want to read these related articles here

Ask Your Question 

Got a programming related question? You may want to post your question here

Programming Answers here

© 2020 DotNetHeaven. All rights reserved.