html tutorial - shadowblur Property in HTML5 Canvas - html5 - html code - html form

Learn html - html tutorial - Shadowblur property in html5 canvas - html examples - html programs

The shadowBlur is one of the shadows property in canvas.
It is defined as sets the blur levels for shadows.
This value specifies to a number of pixels and the default value is 0.
shadowBlur property of the canvas 2D specifies the levels of blurring effect.

Syntax for shadowBlur property in HTML5 Canvas :

context.shadowBlur=number;

Parameter values for shadowBlur property in HTML5 Canvas:

Value	Description
number	The blur level for the shadow.

Sample Coding for shadowBlur in HTML Canvas:

Tryit<!DOCTYPE html>
<html>
    <head>
        <title>Wikitechy HTML Canvas shadowBlur with example</title>
    </head>
    <body>
        <h1>Wikitechy HTML Canvas shadowBlur with example</h1>
        <canvas id="wikitechyCanvas" width="300" height="150"
                style="border:1px solid #d3d3d3;">
        </canvas>
        <script>
            var a= document.getElementById("wikitechyCanvas");
            var b = a.getContext("2d");
            b.shadowBlur = 30;
            b.shadowColor = "green";
            b.fillStyle = "purple";
            b.fillRect(30, 30, 120, 100);
        </script>
    </body>
</html>