A glow effect on html5 canvas?

Question

Is it possible to add a glow effect to an already drawn canvas without having to calculate it myself ? (Using gradients, shadow or something...)

I have tried adding a glow by drawing the canvas as an image to a different canvas and drawing it back with a shadow added. The problem with it is that it depends on the amount of pixels around the shadow - because it blurs the image - so that is not good enough.

Answer 1

There is a website that goes over the glow effect along with other typographic effects for canvas text here .

Here's the gist of the glow effect:

// Assuming your canvas element is ctx
ctx.shadowColor = “red” // string
    //Color of the shadow;  RGB, RGBA, HSL, HEX, and other inputs are valid.
ctx.shadowOffsetX = 0; // integer
    //Horizontal distance of the shadow, in relation to the text.
ctx.shadowOffsetY = 0; // integer
    //Vertical distance of the shadow, in relation to the text.
ctx.shadowBlur = 10; // integer
    //Blurring effect to the shadow, the larger the value, the greater the blur.