Easy Tutorial
❮ Prop Style Left Jsref Regexp Nxcomma ❯

HTML canvas strokeStyle Property

Canvas Object

Example

Draw a rectangle. Use red as the stroke color:

JavaScript:


Browser Support

Internet Explorer 9, Firefox, Opera, Chrome, and Safari support the strokeStyle property.

Note: Internet Explorer 8 and earlier versions do not support the <canvas> element.


Definition and Usage

The strokeStyle property sets or returns the color, gradient, or pattern used for strokes.

Default value: #000000
JavaScript syntax: context.strokeStyle = color | gradient | pattern;
--- ---

Property Values

Value Description
color A CSS color value that indicates the stroke color
gradient A gradient object used to fill the drawing (linear radial)
pattern A pattern used to create a pattern stroke

More Examples

Example

Draw a rectangle. Use a gradient stroke:

JavaScript:

Example

Write the text "Big smile!" with a gradient stroke:

JavaScript:


Canvas Object

❮ Prop Style Left Jsref Regexp Nxcomma ❯