diff --git a/web/src/components/settings/SettingsTab.svelte b/web/src/components/settings/SettingsTab.svelte
index 2f9e14dc..0da6fc5d 100644
--- a/web/src/components/settings/SettingsTab.svelte
+++ b/web/src/components/settings/SettingsTab.svelte
@@ -21,11 +21,12 @@
 
 <style>
     .settings-tab {
+        --small-padding: 4px;
         display: flex;
         flex-direction: row;
         align-items: center;
-        gap: 10px;
-        padding: 8px;
+        gap: calc(var(--small-padding) * 2);
+        padding: 7px;
         font-weight: 500;
         background: var(--primary);
         color: var(--button-text);
@@ -56,7 +57,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        padding: 5px;
-        border-radius: 5px;
+        padding: var(--small-padding);
+        border-radius: var(--small-padding);
     }
 </style>