diff --git a/src/App.tsx b/src/App.tsx
index 582a136..c148bee 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -154,7 +154,7 @@ function App() {
 
       <button
         type="button"
-        className="mx-auto mt-8 flex items-center px-2.5 py-1.5 border border-transparent text-xs font-medium rounded text-indigo-700 bg-indigo-100 hover:bg-indigo-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
+        className="mx-auto mt-8 flex items-center px-2.5 py-1.5 border border-transparent text-xs font-medium rounded text-indigo-700 bg-indigo-100 hover:bg-indigo-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 select-none"
         onClick={() => setIsAboutModalOpen(true)}
       >
         About this game
diff --git a/src/components/keyboard/Key.tsx b/src/components/keyboard/Key.tsx
index 3e747a6..959ab58 100644
--- a/src/components/keyboard/Key.tsx
+++ b/src/components/keyboard/Key.tsx
@@ -19,7 +19,7 @@ export const Key = ({
   onClick,
 }: Props) => {
   const classes = classnames(
-    'flex items-center justify-center rounded mx-0.5 text-xs font-bold cursor-pointer',
+    'flex items-center justify-center rounded mx-0.5 text-xs font-bold cursor-pointer select-none',
     {
       'bg-slate-200 hover:bg-slate-300 active:bg-slate-400': !status,
       'bg-slate-400 text-white': status === 'absent',
@@ -31,12 +31,12 @@ export const Key = ({
   )
 
   return (
-    <div
+    <button
       style={{ width: `${width}px`, height: '58px' }}
       className={classes}
       onClick={() => onClick(value)}
     >
       {children || value}
-    </div>
+    </button>
   )
 }