Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

HTML | canvas globalAlpha Property

  • Last Updated : 30 Sep, 2019

The globalAlpha property is used to set or return the current alpha or transparency value of the drawing. The value must be a number between 0.0 to 1.0.
Here, 0.0 denotes fully transparent and 1.0 denotes no transparency. By default it is 1.0.


Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.


Property values:

  • number: It is the value between 0.0 to 1.0.


<!DOCTYPE html>
    <h3 style="color:green">GeeksforGeeks</h3>
    <h3>HTML canvas globalalpha property</h3>
    <canvas id="myCanvas"
            style="border:2px solid ;">
        var can = document.getElementById("myCanvas");
        var gfg = can.getContext("2d");
        gfg.fillStyle = "green";
        gfg.fillRect(50, 50, 95, 50);
        //Turn transparency on
        gfg.globalAlpha = 0.5;
        gfg.fillStyle = "green";
        gfg.fillRect(50, 100, 95, 50);


Browsers supported:

  • Chrome
  • Internet Explorer 9.0
  • Safari
  • Firefox
  • Opera
My Personal Notes arrow_drop_up
Recommended Articles
Page :