diff --git a/assets/dark.scss b/assets/dark.scss
index caaf6a47..c0e3dcac 100644
--- a/assets/dark.scss
+++ b/assets/dark.scss
@@ -10,6 +10,7 @@ body[data-theme="dark"] {
   a { color: lighten($primary, 40%); }
   a:hover { color: lighten($primary, 30%); }
   .text-dark { color: $light !important; }
+  .btn-primary { color: $light; }
   .btn-outline-primary { color: $light; &:hover {color: $light;}}
   .btn-outline-success { color: lighten($success, 20%); &:hover {color: $light;} }
   .alert-info { background-color: darken($info, 35%); border-color: darken($info, 25%); color: $light; }
diff --git a/components/ModeSwitch.vue b/components/ModeSwitch.vue
index 4fc9de20..5bf2b3e7 100644
--- a/components/ModeSwitch.vue
+++ b/components/ModeSwitch.vue
@@ -4,6 +4,7 @@
             <label>
                 <input class="form-check-input" type="checkbox" v-model="isDark">
                 <Icon :v="isDark ? 'moon' : 'sun'"/>
+                {{ $t('mode.' + (isDark ? 'dark' : 'light')) }}
             </label>
         </div>
     </div>
diff --git a/locale/de/translations.suml b/locale/de/translations.suml
index e560f9be..d2b3495e 100644
--- a/locale/de/translations.suml
+++ b/locale/de/translations.suml
@@ -492,6 +492,10 @@ images:
 error:
     generic: 'Something went wrong, please try again…'  # TODO
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abrosexual: 'Abrosexuell'
     Achillean: 'Achillean'
diff --git a/locale/en/translations.suml b/locale/en/translations.suml
index 55b6a8d4..95a20f80 100644
--- a/locale/en/translations.suml
+++ b/locale/en/translations.suml
@@ -567,3 +567,7 @@ images:
 
 error:
     generic: 'Something went wrong, please try again…'
+
+mode:
+    dark: 'Dark mode'
+    light: 'Light mode'
diff --git a/locale/es/translations.suml b/locale/es/translations.suml
index b8702843..7813f710 100644
--- a/locale/es/translations.suml
+++ b/locale/es/translations.suml
@@ -502,6 +502,10 @@ images:
 error:
     generic: 'Algo salió mal. Por favor, vuelve a intentarlo…'
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abroromantic: 'Abrorrománti{inflection_c}'
     Abrosexual: 'Abrosexual'
diff --git a/locale/fr/translations.suml b/locale/fr/translations.suml
index fb678d0e..7ca8189d 100644
--- a/locale/fr/translations.suml
+++ b/locale/fr/translations.suml
@@ -483,6 +483,10 @@ images:
 error:
     generic: 'Quelque chose s''est rompu, essayez encore s''il vous plaît…'
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abroromantic: 'Abroromantyczn{adjective_n}'
     Abrosexual: 'Abroseksualn{adjective_n}'
diff --git a/locale/nl/translations.suml b/locale/nl/translations.suml
index ddf0ac05..289baaaa 100644
--- a/locale/nl/translations.suml
+++ b/locale/nl/translations.suml
@@ -496,6 +496,10 @@ images:
 error:
     generic: 'Er is iets misgegaan, probeer het opnieuw…'
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abroromantic: 'Abroromantisch'
     Abrosexual: 'Abroseksueel'
diff --git a/locale/pl/translations.suml b/locale/pl/translations.suml
index 5f4d8e49..95fdec0b 100644
--- a/locale/pl/translations.suml
+++ b/locale/pl/translations.suml
@@ -1101,6 +1101,10 @@ images:
 error:
     generic: 'Coś poszło nie tak, spróbuj ponownie…'
 
+mode:
+    dark: 'Tryb nocny'
+    light: 'Tryb dzienny'
+
 flags:
     Abroromantic: 'Abroromantyczn{adjective_n}'
     Abrosexual: 'Abroseksualn{adjective_n}'
diff --git a/locale/pt/translations.suml b/locale/pt/translations.suml
index 74f7a8d1..ed0de395 100644
--- a/locale/pt/translations.suml
+++ b/locale/pt/translations.suml
@@ -500,6 +500,10 @@ images:
 error:
     generic: 'Alguma coisa deu errado, tente novamente'
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abroromantic: 'Abrorromânti{inflection_c}'
     Abrosexual: 'Abrossexual'
diff --git a/locale/ru/translations.suml b/locale/ru/translations.suml
index 738a3d16..ef2208fd 100644
--- a/locale/ru/translations.suml
+++ b/locale/ru/translations.suml
@@ -1072,6 +1072,10 @@ images:
 error:
     generic: 'Coś poszło nie tak, spróbuj ponownie…'
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abroromantic: 'Abroromantyczn{adjective_n}'
     Abrosexual: 'Abroseksualn{adjective_n}'
diff --git a/locale/yi/translations.suml b/locale/yi/translations.suml
index 50ffb1a8..273056c7 100644
--- a/locale/yi/translations.suml
+++ b/locale/yi/translations.suml
@@ -513,6 +513,10 @@ images:
 error:
     generic: 'Something went wrong, please try again…'
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abroromantic: 'אַבראָראָמאַנטיש'
     Abrosexual: 'אַבראָסעקסועל'
diff --git a/locale/zh/translations.suml b/locale/zh/translations.suml
index f922265f..8496c5bc 100644
--- a/locale/zh/translations.suml
+++ b/locale/zh/translations.suml
@@ -481,6 +481,10 @@ images:
 error:
     generic: '出了點問題，請重試...'
 
+mode:
+    dark: 'Dark mode'  # TODO
+    light: 'Light mode'
+
 flags:
     Abrosexual: '嫩性戀'
     Abroromantic: '嫩浪漫傾向'
diff --git a/routes/homepage.vue b/routes/homepage.vue
index 401be2a6..74c11528 100644
--- a/routes/homepage.vue
+++ b/routes/homepage.vue
@@ -8,6 +8,8 @@
         <section>
             <T>home.about</T>
 
+            <ModeSwitch class="mt-3"/>
+
             <div v-if="!user && $t('profile.banner', {}, false)" class="alert alert-info">
                 <nuxt-link :to="'/' + config.user.route" class="float-end btn btn-primary m-2 me-0">
                     <Icon v="id-card"/>