THE WORLD'S LARGEST WEB DEVELOPER SITE

HTML canvas shadowColor Property

❮ Canvas Object

Example

Draw a red rectangle with a black shadow:

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
shadowColor 4.0 9.0 3.6 4.0 10.1

Definition and Usage

The shadowColor property sets or returns the color to use for shadows.

Note: Use the shadowColor property together with the shadowBlur property to create a shadow.

Tip: Adjust the shadow by using the shadowOffsetX and shadowOffsetY properties.

Default value: #000000
JavaScript syntax: context.shadowColor = color;

Property Values

Value Description Play it
color The CSS color value to use for shadows. Default value is #000000 Play it »

❮ Canvas Object