fabric.js PatternBrush
// Original canvas const canvas = new fabric.Canvas('canvas'); fabric.Image.fromURL('https://picsum.photos/500/500?image=0', function(oImg) { // scale image oImg.scale(0.5); canvas.add(oImg); }); canvas.isDrawingMode = true; const img = new Image(); img.onload = function() { var texturePatternBrush = new fabric.PatternBrush(canvas); // is it possible to also scale the image here? texturePatternBrush.source = img; // texturePatternBrush.scale(0.5); texturePatternBrush.width = 50; texturePatternBrush.height = 50; canvas.freeDrawingBrush = texturePatternBrush; }; img.src = 'https://picsum.photos/500/500?image=0';
<canvas id="canvas" width="500" height="500" ></canvas>