diff --git a/src/components/Header.vue b/src/components/Header.vue
index 8c2a3e6..f932415 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -8,17 +8,17 @@
       @click="() => toggle()"
     >
       <IconToggleOn v-if="editMode" class="h-6 w-6 fill-emerald-700" />
-      <IconToggleOff v-else class="h-6 w-6 cursor-pointer" />
+      <IconToggleOff v-else class="h-6 w-6 cursor-pointer fill-current" />
       <span>{{ t('components.header.edit-mode.text') }}</span>
     </div>
     <div @click="() => toggleDark()">
-      <IconLightDark class="h-6 w-6 cursor-pointer" />
+      <IconLightDark class="h-6 w-6 cursor-pointer fill-current" />
     </div>
     <div v-if="isAuthenticated" @click="() => setToken('')">
-      <IconLogout class="h-6 w-6 cursor-pointer"></IconLogout>
+      <IconLogout class="h-6 w-6 cursor-pointer fill-current"></IconLogout>
     </div>
     <router-link to="/login" v-else>
-      <IconLogin class="h-6 w-6 cursor-pointer"></IconLogin>
+      <IconLogin class="h-6 w-6 cursor-pointer fill-current"></IconLogin>
     </router-link>
   </header>
 </template>
diff --git a/src/components/InputCheckbox.vue b/src/components/InputCheckbox.vue
index 0dd08ef..b6e0337 100644
--- a/src/components/InputCheckbox.vue
+++ b/src/components/InputCheckbox.vue
@@ -3,7 +3,10 @@
     <label class="mb-1 block w-full" :for="name">{{ label }}</label>
     <div @click="handleChange(checked)">
       <IconToggleOn v-if="!checked" class="h-12 w-12 fill-emerald-700" />
-      <IconToggleOff v-else class="h-12 w-12 cursor-pointer fill-stone-500" />
+      <IconToggleOff
+        v-else
+        class="h-12 w-12 cursor-pointer fill-stone-500 dark:fill-current"
+      />
     </div>
   </div>
 </template>