diff --git a/js/CanvasView.js b/js/CanvasView.js
index 94bab3e..4c0fde6 100644
--- a/js/CanvasView.js
+++ b/js/CanvasView.js
@@ -440,7 +440,7 @@ async function createCanvasWidget(node, widget, app) {
             <tr><td><kbd>Click + Drag</kbd></td><td>Paint on the mask</td></tr>
             <tr><td><kbd>Middle Mouse Button + Drag</kbd></td><td>Pan canvas view</td></tr>
             <tr><td><kbd>Mouse Wheel</kbd></td><td>Zoom view in/out</td></tr>
-            <tr><td><strong>Brush Controls</strong></td><td>Use sliders to control brush <strong>Size</strong>, <strong>Strength</strong>, and <strong>Softness</strong></td></tr>
+            <tr><td><strong>Brush Controls</strong></td><td>Use sliders to control brush <strong>Size</strong>, <strong>Strength</strong>, and <strong>Hardness</strong></td></tr>
             <tr><td><strong>Clear Mask</strong></td><td>Remove the entire mask</td></tr>
             <tr><td><strong>Exit Mode</strong></td><td>Click the "Draw Mask" button again</td></tr>
         </table>
@@ -798,15 +798,15 @@ async function createCanvasWidget(node, widget, app) {
                     })
                 ]),
                 $el("div.painter-slider-container.mask-control", {style: {display: 'none'}}, [
-                    $el("label", {for: "brush-softness-slider", textContent: "Softness:"}),
+                    $el("label", {for: "brush-hardness-slider", textContent: "Hardness:"}),
                     $el("input", {
-                        id: "brush-softness-slider",
+                        id: "brush-hardness-slider",
                         type: "range",
                         min: "0",
                         max: "1",
                         step: "0.05",
                         value: "0.5",
-                        oninput: (e) => canvas.maskTool.setBrushSoftness(parseFloat(e.target.value))
+                        oninput: (e) => canvas.maskTool.setBrushHardness(parseFloat(e.target.value))
                     })
                 ]),
                 $el("button.painter-button.mask-control", {
diff --git a/js/MaskTool.js b/js/MaskTool.js
index 92ad026..456689f 100644
--- a/js/MaskTool.js
+++ b/js/MaskTool.js
@@ -16,7 +16,7 @@ export class MaskTool {
         this.isActive = false;
         this.brushSize = 20;
         this.brushStrength = 0.5;
-        this.brushSoftness = 0.5;
+        this.brushHardness = 0.5;
         this.isDrawing = false;
         this.lastPosition = null;
 
@@ -42,8 +42,8 @@ export class MaskTool {
         this.canvasInstance.canvas.parentElement.appendChild(this.previewCanvas);
     }
 
-    setBrushSoftness(softness) {
-        this.brushSoftness = Math.max(0, Math.min(1, softness));
+    setBrushHardness(hardness) {
+        this.brushHardness = Math.max(0, Math.min(1, hardness));
     }
 
     initMaskCanvas() {
@@ -159,10 +159,11 @@ export class MaskTool {
             this.maskCtx.lineTo(canvasX, canvasY);
             const gradientRadius = this.brushSize / 2;
 
-            if (this.brushSoftness === 0) {
+            if (this.brushHardness === 1) {
                 this.maskCtx.strokeStyle = `rgba(255, 255, 255, ${this.brushStrength})`;
             } else {
-                const innerRadius = gradientRadius * this.brushSoftness;
+                // hardness: 1 = hard edge, 0 = soft edge
+                const innerRadius = gradientRadius * this.brushHardness;
                 const gradient = this.maskCtx.createRadialGradient(
                     canvasX, canvasY, innerRadius,
                     canvasX, canvasY, gradientRadius