HTML5 provides with new styling capabilities when it comes to canvas. We can improve the way lines are drawn on canvas with the help of stroke styles. The HTML5 stroke styles are used to modify properties of the context to make our shapes look more users friendlier.

See example below for simple representation of Stroke Styles

<script>

    function contextExample(context)

    {

        context.lineWidth = 10;

        context.lineJoin = 'round'

        context.strokeStyle = '#881199'

        context.stroke();

    }

</script>

As you can see , all that we did before stroking, we applied properties to change appearance. We did this by increasing size to 10, making it round coroners and applying color to the stroke. This allows us to draw more appealing lines, object on HTML5 canvas. There are additional properties available for us in HTML5 that can help style strokes. They will be covered in other tutorials on HTML5 development.