diff --git a/src/components/ImageCanvas.tsx b/src/components/ImageCanvas.tsx
index c42c402..166afc0 100644
--- a/src/components/ImageCanvas.tsx
+++ b/src/components/ImageCanvas.tsx
@@ -78,7 +78,14 @@ export const ImageCanvas: React.FC = () => {
   }, []);
 
   const handleMouseDown = (e: any) => {
-    if (selectedTool !== 'mask' || !image) return;
+    // Prevent default browser actions like scrolling on touch devices
+    if (e.evt.cancelable) {
+      e.evt.preventDefault();
+    }
+
+    if (selectedTool !== 'mask' || !image) {
+      return;
+    }
     
     setIsDrawing(true);
     const stage = e.target.getStage();
@@ -102,6 +109,10 @@ export const ImageCanvas: React.FC = () => {
   };
 
   const handleMouseMove = (e: any) => {
+    // Prevent default browser actions like scrolling on touch devices
+    if (e.evt.cancelable) {
+      e.evt.preventDefault();
+    }
     if (!isDrawing || selectedTool !== 'mask' || !image) return;
     
     const stage = e.target.getStage();
@@ -289,6 +300,9 @@ export const ImageCanvas: React.FC = () => {
           onMouseDown={handleMouseDown}
           onMousemove={handleMouseMove}
           onMouseup={handleMouseUp}
+          onTouchStart={handleMouseDown}
+          onTouchMove={handleMouseMove}
+          onTouchEnd={handleMouseUp}
           style={{ 
             cursor: selectedTool === 'mask' ? 'crosshair' : 'default' 
           }}