How to re-tint a grayscale image on canvas

Question

Is there any quick way to colorize greyscale icon (png image with transparent background) when drawing it on canvas? By colorize I mean turning greyscale icon into lets say

Answer 1

Hey try this alternative!

First create a canvas element and use canvas context to draw image. You can use the canvas filters to apply effects. then use toDataURL method to get the png of the image. All the detailed procedure is explained in the below websites.

http://www.html5canvastutorials.com/advanced/html5-canvas-grayscale-image-colors-tutorial/

Finally use .toDataURL() method to export/save it.

Hope it works for you!