diff --git a/vue/src/components/input/ToggleButton.vue b/vue/src/components/input/ToggleButton.vue
index 906c294..492a9b3 100644
--- a/vue/src/components/input/ToggleButton.vue
+++ b/vue/src/components/input/ToggleButton.vue
@@ -17,13 +17,13 @@ function toggle() {
 <template>
     <button
         @click="toggle"
-        class="box-content border-2 border-primary w-20 h-fit rounded-full cursor-pointer"
+        class="box-content border-2 border-primary w-10 h-fit rounded-full cursor-pointer"
         :class="[props.modelValue ? 'bg-bg_secondary' : 'bg-bg_primary']"
     >
         <svg
             viewBox="0 0 40 40"
-            class="w-10 h-10 transition-all duration-300 ease-in-out"
-            :class="[props.modelValue ? 'ml-10' : 'ml-0']"
+            class="w-5 h-5 transition-all duration-300 ease-in-out"
+            :class="[props.modelValue ? 'ml-5' : 'ml-0']"
         >
             <circle class="fill-primary" cx="20" cy="20" r="20" />
         </svg>