diff --git a/js/src/features/compose/recording-overlay.tsx b/js/src/features/compose/recording-overlay.tsx
index 195d2cd..978fdb2 100644
--- a/js/src/features/compose/recording-overlay.tsx
+++ b/js/src/features/compose/recording-overlay.tsx
@@ -225,10 +225,13 @@ export function RecordingOverlay({
             to review
           </span>
           <span>
+            <kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
+              Esc
+            </kbd>{" or "}
             <kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
               Q
             </kbd>{" "}
-            cancel
+            to cancel
           </span>
         </div>
       )}
@@ -252,10 +255,13 @@ export function RecordingOverlay({
               next
             </span>
             <span>
+              <kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
+                Esc
+              </kbd>{" or "}
               <kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
                 Q
               </kbd>{" "}
-              cancel
+              to cancel
             </span>
             <span>
               <Button