diff --git a/website/canvas.html b/website/canvas.html
index e4045e3..a29a08c 100644
--- a/website/canvas.html
+++ b/website/canvas.html
@@ -3215,6 +3215,7 @@
 			let ghostEl = null;
 
 			function setPendingTool(tagName, props = {}) {
+				if (wbTool) setWbTool(null); // clear whiteboard tool when switching
 				pendingTool = { tagName, props };
 				canvas.style.cursor = "crosshair";
 
@@ -3270,10 +3271,11 @@
 				}
 			});
 
-			// ESC clears pending tool
+			// ESC returns to default selector tool
 			document.addEventListener("keydown", (e) => {
-				if (e.key === "Escape" && pendingTool) {
-					clearPendingTool();
+				if (e.key === "Escape") {
+					if (wbTool) setWbTool(null);
+					if (pendingTool) clearPendingTool();
 				}
 			});
 
@@ -3561,6 +3563,7 @@
 			const newArrowBtn = document.getElementById("new-arrow");
 
 			newArrowBtn.addEventListener("click", () => {
+				if (wbTool) setWbTool(null); // clear whiteboard tool
 				connectMode = !connectMode;
 				newArrowBtn.classList.toggle("active", connectMode);
 				canvas.classList.toggle("connect-mode", connectMode);
@@ -3770,6 +3773,11 @@
 
 				wbPreviewEl = null;
 				wbCurrentPath = [];
+
+				// Drawing tools are temporary — return to selector after one stroke
+				if (wbTool && wbTool !== "eraser") {
+					setWbTool(null);
+				}
 			});
 
 			// Eraser: click on existing SVG strokes to delete them + remove from Automerge