THE WORLD'S LARGEST WEB DEVELOPER SITE

HTML canvas shadowBlur Property

❮ Canvas Object

Example

Draw a red rectangle with a black shadow, with blur level of 20:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.shadowBlur = 20;
ctx.shadowColor = "black";
ctx.fillStyle = "red";
ctx.fillRect(20, 20, 100, 80);
Try it Yourself »

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
shadowBlur 4.0 9.0 3.6 4.0 10.1

Definition and Usage

The shadowBlur property sets or returns the blur level for shadows.

Default value: 0
JavaScript syntax: context.shadowBlur = number;

Property Values

Value Description Play it
number The blur level for the shadow Play it »

❮ Canvas Object