diff --git a/apps/web/src/components/keyboard-shortcuts-help.tsx b/apps/web/src/components/keyboard-shortcuts-help.tsx
index dd06315d..dd6a500b 100644
--- a/apps/web/src/components/keyboard-shortcuts-help.tsx
+++ b/apps/web/src/components/keyboard-shortcuts-help.tsx
@@ -229,10 +229,10 @@ function EditableShortcutKey({
 
   return (
     <Button
-      variant="text"
+      variant="outline"
       size="sm"
-      className={`inline-flex font-sans text-xs rounded px-2 min-w-6 min-h-6 leading-none items-center justify-center shadow-xs border mr-1 cursor-pointer hover:bg-opacity-80 ${
-        isRecording ? "border-primary bg-primary/10" : "border bg-accent"
+      className={`font-sans px-2 min-w-6 min-h-6 leading-none mr-1 hover:bg-opacity-80 ${
+        isRecording ? "border-primary bg-primary/10" : "border bg-accent/50"
       }`}
       onClick={handleClick}
       title={