diff --git a/code/frontend/src/components/Button.module.css b/code/frontend/src/components/Button.module.css
index 3b8902b..15bb8e5 100644
--- a/code/frontend/src/components/Button.module.css
+++ b/code/frontend/src/components/Button.module.css
@@ -11,6 +11,10 @@
     cursor: pointer;
 }
 
+.Button:focus-visible {
+    outline: 2px solid var(--outline);
+}
+
 .ButtonGreen {
     color: var(--fg-green);
     background-color: var(--bg-green);
diff --git a/code/frontend/src/components/ButtonSidebar.module.css b/code/frontend/src/components/ButtonSidebar.module.css
index 0d8a1b3..f7534dd 100644
--- a/code/frontend/src/components/ButtonSidebar.module.css
+++ b/code/frontend/src/components/ButtonSidebar.module.css
@@ -34,6 +34,10 @@
     color: var(--fg-button-on);
 }
 
+.ButtonLink:focus-visible .ButtonSidebar {
+    outline: 2px solid var(--outline);
+}
+
 .ButtonIcon {
     font-size: x-large;
 
diff --git a/code/frontend/src/components/Input.module.css b/code/frontend/src/components/Input.module.css
index 861e63f..3c3a12d 100644
--- a/code/frontend/src/components/Input.module.css
+++ b/code/frontend/src/components/Input.module.css
@@ -19,4 +19,4 @@
 
     color: var(--fg-field-on);
     background-color: var(--bg-field-on);
-}
\ No newline at end of file
+}
diff --git a/code/frontend/src/index.css b/code/frontend/src/index.css
index 943ac93..9d0bb46 100644
--- a/code/frontend/src/index.css
+++ b/code/frontend/src/index.css
@@ -43,6 +43,8 @@ body {
 
     --bg-red: #863821;
     --fg-red: #FFFFFF;
+
+    --outline: white;
 }
 
 .ThemeLight {
@@ -68,4 +70,6 @@ body {
 
     --bg-red: #FF8866;
     --fg-red: #863821;
+
+    --outline: black;
 }