diff --git a/src/components/about/about.module.css b/src/components/about/about.module.css
index d634777..a9571dc 100644
--- a/src/components/about/about.module.css
+++ b/src/components/about/about.module.css
@@ -83,12 +83,14 @@
       transform: translateX(-50%);
     }
 
-    &:hover {
+    &:hover,
+    &:focus-visible {
       background-color: var(--color-neutral-100);
     }
 
     &:focus-visible {
-      outline: 1px solid var(--color-neutral-950);
+      outline: 2px solid var(--color-neutral-400);
+      outline-offset: 2px;
     }
   }
 }
diff --git a/src/components/buttons/play/play.module.css b/src/components/buttons/play/play.module.css
index 9ad39a7..612e2ca 100644
--- a/src/components/buttons/play/play.module.css
+++ b/src/components/buttons/play/play.module.css
@@ -12,7 +12,6 @@
   background-color: var(--color-neutral-950);
   border: 1px solid var(--color-neutral-50);
   border-radius: 100px;
-  outline: none;
   transition: 0.2s;
 
   &:hover {
@@ -29,6 +28,7 @@
   }
 
   &:focus-visible {
-    outline: 1px solid var(--color-neutral-950);
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
   }
 }
diff --git a/src/components/buttons/unselect/unselect.module.css b/src/components/buttons/unselect/unselect.module.css
index 63e06bd..64537a3 100644
--- a/src/components/buttons/unselect/unselect.module.css
+++ b/src/components/buttons/unselect/unselect.module.css
@@ -12,7 +12,6 @@
   background-color: var(--color-neutral-100);
   border: 1px solid var(--color-neutral-300);
   border-radius: 100px;
-  outline: none;
   transition: 0.2s;
 
   &:disabled,
@@ -20,12 +19,14 @@
     cursor: not-allowed;
   }
 
-  &:hover {
+  &:hover,
+  &:focus-visible {
     background-color: var(--color-neutral-200);
   }
 
   &:focus-visible {
-    outline: 1px solid var(--color-neutral-950);
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
   }
 }
 
diff --git a/src/components/modal/modal.module.css b/src/components/modal/modal.module.css
index f995c57..3f66d8f 100644
--- a/src/components/modal/modal.module.css
+++ b/src/components/modal/modal.module.css
@@ -54,7 +54,8 @@
       outline: none;
 
       &:focus-visible {
-        outline: 1px solid var(--color-neutral-950);
+        outline: 2px solid var(--color-neutral-400);
+        outline-offset: 2px;
       }
     }
   }
diff --git a/src/components/modals/presets/list/list.module.css b/src/components/modals/presets/list/list.module.css
index 88eca0a..b2b8a81 100644
--- a/src/components/modals/presets/list/list.module.css
+++ b/src/components/modals/presets/list/list.module.css
@@ -36,7 +36,8 @@
       outline: none;
 
       &:focus-visible {
-        outline: 1px solid var(--color-neutral-950);
+        outline: 2px solid var(--color-neutral-400);
+        outline-offset: 2px;
       }
     }
 
@@ -56,7 +57,8 @@
       outline: none;
 
       &:focus-visible {
-        outline: 1px solid var(--color-neutral-950);
+        outline: 2px solid var(--color-neutral-400);
+        outline-offset: 2px;
       }
 
       &.primary {
diff --git a/src/components/modals/presets/new/new.module.css b/src/components/modals/presets/new/new.module.css
index 95df4ff..76d0bd2 100644
--- a/src/components/modals/presets/new/new.module.css
+++ b/src/components/modals/presets/new/new.module.css
@@ -33,7 +33,8 @@
       outline: none;
 
       &:focus-visible {
-        outline: 1px solid var(--color-neutral-950);
+        outline: 2px solid var(--color-neutral-400);
+        outline-offset: 2px;
       }
     }
 
@@ -53,7 +54,8 @@
       outline: none;
 
       &:focus-visible {
-        outline: 1px solid var(--color-neutral-950);
+        outline: 2px solid var(--color-neutral-400);
+        outline-offset: 2px;
       }
 
       &:disabled {
diff --git a/src/components/modals/share-link/share-link.module.css b/src/components/modals/share-link/share-link.module.css
index a4a7852..05a17b0 100644
--- a/src/components/modals/share-link/share-link.module.css
+++ b/src/components/modals/share-link/share-link.module.css
@@ -33,7 +33,8 @@
     outline: none;
 
     &:focus-visible {
-      outline: 1px solid var(--color-neutral-950);
+      outline: 2px solid var(--color-neutral-400);
+      outline-offset: 2px;
     }
   }
 
@@ -52,10 +53,12 @@
     transition: 0.2s;
 
     &:focus-visible {
-      outline: 1px solid var(--color-neutral-950);
+      outline: 2px solid var(--color-neutral-400);
+      outline-offset: 2px;
     }
 
-    &:hover {
+    &:hover,
+    &:focus-visible {
       background-color: var(--color-neutral-200);
     }
   }
diff --git a/src/components/modals/shared/shared.module.css b/src/components/modals/shared/shared.module.css
index 6884d3a..324a535 100644
--- a/src/components/modals/shared/shared.module.css
+++ b/src/components/modals/shared/shared.module.css
@@ -52,10 +52,12 @@
     transition: 0.2s;
 
     &:focus-visible {
-      outline: 1px solid var(--color-neutral-950);
+      outline: 2px solid var(--color-neutral-400);
+      outline-offset: 2px;
     }
 
-    &:hover {
+    &:hover,
+    &:focus-visible {
       color: var(--color-foreground);
       background-color: var(--color-neutral-300);
     }
@@ -64,7 +66,8 @@
       color: var(--color-neutral-200);
       background-color: var(--color-neutral-950);
 
-      &:hover {
+      &:hover,
+      &:focus-visible {
         background-color: var(--color-neutral-800);
       }
     }
diff --git a/src/components/sound/favorite/favorite.module.css b/src/components/sound/favorite/favorite.module.css
index 3573701..fb74e40 100644
--- a/src/components/sound/favorite/favorite.module.css
+++ b/src/components/sound/favorite/favorite.module.css
@@ -14,18 +14,19 @@
   background-color: var(--color-neutral-100);
   border: 1px solid var(--color-neutral-200);
   border-radius: 50%;
-  outline: none;
   transition: 0.2s;
 
-  &:hover {
+  &:hover,
+  &:focus-visible {
     color: var(--color-foreground);
   }
 
+  &:focus-visible {
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
+  }
+
   &.isFavorite {
     color: var(--color-foreground);
   }
-
-  &:focus-visible {
-    outline: 1px solid var(--color-neutral-950);
-  }
 }
diff --git a/src/components/sound/sound.module.css b/src/components/sound/sound.module.css
index fd733ff..e9da71b 100644
--- a/src/components/sound/sound.module.css
+++ b/src/components/sound/sound.module.css
@@ -11,6 +11,11 @@
   border-radius: 8px;
   transition: 0.2s;
 
+  &:focus-visible {
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
+  }
+
   &.hidden {
     display: none;
   }
@@ -78,7 +83,8 @@
     }
   }
 
-  &:hover .icon {
+  &:hover .icon,
+  &:focus-visible .icon {
     color: var(--color-foreground-subtle);
   }
 
diff --git a/src/components/sounds/sounds.module.css b/src/components/sounds/sounds.module.css
index d89268f..c40802f 100644
--- a/src/components/sounds/sounds.module.css
+++ b/src/components/sounds/sounds.module.css
@@ -21,6 +21,11 @@
   border: 1px solid var(--color-neutral-200);
   border-radius: 50px;
 
+  &:focus-visible {
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
+  }
+
   &::before {
     position: absolute;
     top: -1px;
diff --git a/src/components/special-button/special-button.module.css b/src/components/special-button/special-button.module.css
index f493f63..30ed928 100644
--- a/src/components/special-button/special-button.module.css
+++ b/src/components/special-button/special-button.module.css
@@ -18,6 +18,11 @@
   border-radius: 50px;
   transition: 0.2s;
 
+  &:focus-visible {
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
+  }
+
   &::after {
     position: absolute;
     top: 1px;
@@ -58,7 +63,8 @@
     animation-iteration-count: infinite;
   }
 
-  &:hover::after {
+  &:hover::after,
+  &:focus-visible::after {
     background-color: var(--color-neutral-100);
   }
 }
diff --git a/src/components/toolbox/notepad/button/button.module.css b/src/components/toolbox/notepad/button/button.module.css
index 2c1e4c0..4a4e756 100644
--- a/src/components/toolbox/notepad/button/button.module.css
+++ b/src/components/toolbox/notepad/button/button.module.css
@@ -15,7 +15,8 @@
   transition-property: border-color, color, background-color;
 
   &:focus-visible {
-    outline: 1px solid var(--color-neutral-950);
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
   }
 
   &.critical {
@@ -37,7 +38,8 @@
     }
   }
 
-  &:hover {
+  &:hover,
+  &:focus-visible {
     background-color: var(--color-neutral-200);
   }
 }
diff --git a/src/components/toolbox/notepad/notepad.module.css b/src/components/toolbox/notepad/notepad.module.css
index 6e2385f..2dadc40 100644
--- a/src/components/toolbox/notepad/notepad.module.css
+++ b/src/components/toolbox/notepad/notepad.module.css
@@ -31,7 +31,8 @@
   scroll-padding-bottom: 12px;
 
   &:focus-visible {
-    outline: 1px solid var(--color-neutral-950);
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
   }
 }
 
diff --git a/src/components/toolbox/pomodoro/button/button.module.css b/src/components/toolbox/pomodoro/button/button.module.css
index 00b2d3b..61f33f4 100644
--- a/src/components/toolbox/pomodoro/button/button.module.css
+++ b/src/components/toolbox/pomodoro/button/button.module.css
@@ -14,10 +14,12 @@
   transition: 0.2s;
 
   &:focus-visible {
-    outline: 1px solid var(--color-neutral-950);
+    outline: 2px solid var(--color-neutral-400);
+    outline-offset: 2px;
   }
 
-  &:hover {
+  &:hover,
+  &:focus-visible {
     background-color: var(--color-neutral-200);
   }
 
diff --git a/src/components/toolbox/pomodoro/setting/setting.module.css b/src/components/toolbox/pomodoro/setting/setting.module.css
index 5f3c55a..89583ef 100644
--- a/src/components/toolbox/pomodoro/setting/setting.module.css
+++ b/src/components/toolbox/pomodoro/setting/setting.module.css
@@ -33,6 +33,11 @@
       border: 1px solid var(--color-neutral-200);
       border-radius: 4px;
       outline: none;
+
+      &:focus-visible {
+        outline: 2px solid var(--color-neutral-400);
+        outline-offset: 2px;
+      }
     }
   }
 
@@ -57,6 +62,11 @@
       border-radius: 4px;
       outline: none;
 
+      &:focus-visible {
+        outline: 2px solid var(--color-neutral-400);
+        outline-offset: 2px;
+      }
+
       &.primary {
         color: var(--color-neutral-100);
         background-color: var(--color-neutral-950);
diff --git a/src/components/toolbox/pomodoro/tabs/tabs.module.css b/src/components/toolbox/pomodoro/tabs/tabs.module.css
index d181e20..222164c 100644
--- a/src/components/toolbox/pomodoro/tabs/tabs.module.css
+++ b/src/components/toolbox/pomodoro/tabs/tabs.module.css
@@ -20,15 +20,22 @@
     background-color: transparent;
     border: 1px solid transparent;
     border-radius: 4px;
+    outline: none;
     transition: 0.2s;
 
+    &:focus-visible {
+      outline: 2px solid var(--color-neutral-400);
+      outline-offset: 2px;
+    }
+
     &.selected {
       color: var(--color-foreground);
       background-color: var(--color-neutral-200);
       border-color: var(--color-neutral-300);
     }
 
-    &:not(.selected):hover {
+    &:not(.selected):hover,
+    &:not(.selected):focus-visible {
       color: var(--color-foreground);
       background-color: var(--color-neutral-100);
     }