diff --git a/assets/js/appearance.js b/assets/js/appearance.js
index 0acf9f18..d0663390 100644
--- a/assets/js/appearance.js
+++ b/assets/js/appearance.js
@@ -26,16 +26,20 @@ window.addEventListener("DOMContentLoaded", (event) => {
   const switcher = document.getElementById("appearance-switcher");
   const switcherMobile = document.getElementById("appearance-switcher-mobile");
 
+  var targetAppearance = document.documentElement.classList.contains("dark") ? "dark" : "light"
   updateMeta()
+  updateLogo(targetAppearance)
 
   if (switcher) {
     switcher.addEventListener("click", () => {
       document.documentElement.classList.toggle("dark");
+      var targetAppearance = document.documentElement.classList.contains("dark") ? "dark" : "light"
       localStorage.setItem(
         "appearance",
-        document.documentElement.classList.contains("dark") ? "dark" : "light"
+        targetAppearance
       );
       updateMeta()
+      updateLogo(targetAppearance)
     });
     switcher.addEventListener("contextmenu", (event) => {
       event.preventDefault();
@@ -45,11 +49,13 @@ window.addEventListener("DOMContentLoaded", (event) => {
   if (switcherMobile) {
     switcherMobile.addEventListener("click", () => {
       document.documentElement.classList.toggle("dark");
+      var targetAppearance = document.documentElement.classList.contains("dark") ? "dark" : "light"
       localStorage.setItem(
         "appearance",
-        document.documentElement.classList.contains("dark") ? "dark" : "light"
+        targetAppearance
       );
       updateMeta()
+      updateLogo(targetAppearance)
     });
     switcherMobile.addEventListener("contextmenu", (event) => {
       event.preventDefault();
@@ -64,4 +70,21 @@ var updateMeta = () => {
   elem = document.querySelector('body');
   style = getComputedStyle(elem);
   document.querySelector('meta[name="theme-color"]').setAttribute('content', style.backgroundColor);
-}
\ No newline at end of file
+}
+
+var updateLogo = (targetAppearance) => {
+  {{ if and (.Site.Params.Logo) (.Site.Params.SecondaryLogo) }}
+  {{ $primaryLogo := resources.Get .Site.Params.Logo }}
+  {{ $secondaryLogo := resources.Get .Site.Params.SecondaryLogo }}
+  {{ if and ($primaryLogo) ($secondaryLogo) }}
+  var elems;
+  elems = document.querySelectorAll("img.logo")
+  targetLogoPath = 
+    targetAppearance == "{{ .Site.Params.DefaultAppearance }}" ?
+    "{{ $primaryLogo.RelPermalink }}" : "{{ $secondaryLogo.RelPermalink }}"
+  for (const elem of elems) {
+    elem.setAttribute("src", targetLogoPath)
+  }
+  {{ end }}
+  {{- end }}
+}
diff --git a/config/_default/languages.en.toml b/config/_default/languages.en.toml
index 379c57ba..31e570ba 100644
--- a/config/_default/languages.en.toml
+++ b/config/_default/languages.en.toml
@@ -7,6 +7,7 @@ rtl = false
 
 title = "Blowfish"
 # logo = "img/logo.png"
+# secondaryLogo = "img/secondary-logo.png"
 # description = "My awesome website"
 # copyright = "Copy, _right?_ :thinking_face:"