How to draw an image as a brush stroke in canvas in Webflow

Im dveloping a mobile specific website which allows users to draw complex patterns and shapes to their liking. I discovered that canvas is a good way to do this. I understand that canvas has a “drawimage function” that allows for this. But is it possible to do this as in a brush stroke format, where instead of the basic 1px stroke default, you use an actual image.

These images that the users can draw with are indeed graphic png images. I found a tutorial online that shows this however its quite old and very complex and heavy in terms of its code structure, here is a link https://dzone.com/articles/sketching-html5-canvas-and There is a good chance I will be developing this website with webflow. Would this be possible with webflow? and furthermorfor smartphone devices? Thanks Guys

Here is an Image of my prototype just for better understanding

Here is my public share link: LINK
(how to access public share link)