diff --git a/web/src/app.css b/web/src/app.css
index 15d792b..7f7d31f 100644
--- a/web/src/app.css
+++ b/web/src/app.css
@@ -254,6 +254,17 @@
   cursor: not-allowed;
 }
 
+/* clear-log button: mirrors the .panel-label tab on the right edge */
+.log-clear {
+  position: absolute;
+  top: -9px;
+  right: 14px;
+  background: var(--bg);
+  padding: 0 8px;
+  border-bottom: none;
+  z-index: 1;
+}
+
 /* ---------- modal ---------- */
 
 .modal-overlay {
diff --git a/web/src/pages/TaskDetail.tsx b/web/src/pages/TaskDetail.tsx
index 4d8532e..feb5df4 100644
--- a/web/src/pages/TaskDetail.tsx
+++ b/web/src/pages/TaskDetail.tsx
@@ -291,6 +291,11 @@ export function TaskDetail({ id }: { id: number }) {
 
         <div className="panel">
           <span className="panel-label">Event log</span>
+          {log.length > 0 && (
+            <button type="button" className="link-btn log-clear" onClick={() => setLog([])}>
+              clear log
+            </button>
+          )}
           <div className="log-pane">
             {log.length === 0 ? (
               <div className="log-empty">awaiting events over websocket…</div>