The strokeStyle property

The strokeStyle property is used to set the color used for stroking - by both the strokeRect() and stroke() functions

[No canvas support]
An example of using the strokeStyle setting to draw a red rectangle

The strokeStyle option is a property, usually a string, which is used to set the color used to do stroking on the canvas. For example the strokeRect() and stroke() functions both use this setting to determine the color that they use.

As well as a string it can be a linear/radial gradient or a pattern. You can find out more about these at the links below.


An example

<script>
    window.onload = function ()
    {
        var canvas  = document.getElementById("cvs");
        var context = canvas.getContext('2d');

        var x      = 50;
        var y      = 50;
        var width  = 100;
        var height = 100;
    
        context.strokeStyle = 'red';
        context.strokeRect(x, y, width, height);
    }
</script>

See also