1 files changed, 17 insertions, 0 deletions
diff --git a/src/components/DarkToggle.svelte b/src/components/DarkToggle.svelte
new file mode 100644
index 00000000..7ed2ba1c
--- /dev/null
+++ b/src/components/DarkToggle.svelte
@@ -0,0 +1,17 @@
+<script>
+  import { t } from "$lib/translations";
+  import { theme } from "$lib/store";
+  let dark = () => ($theme = $theme === "dark" ? "light" : "dark");
+</script>
+
+<button
+  class="flex justify-center items-center hover:opacity-80 gap-2 font-bold"
+  on:click={dark}
+>
+  <iconify-icon
+    icon={$theme === "dark" ? "ph:sun-bold" : "ph:moon-stars-bold"}
+    width="30"
+  />
+
+  {$t(`nav.${$theme === "dark" ? "light" : "dark"}`)}
+</button>