diff --git a/public/js/commandline.js b/public/js/commandline.js
index 707c1741a..b6ea9a39a 100644
--- a/public/js/commandline.js
+++ b/public/js/commandline.js
@@ -153,6 +153,13 @@ let commands = {
         toggleRandomTheme();
       },
     },
+    {
+      id: "togglePresetCustomTheme",
+      display: "Toggle preset/custom theme",
+      exec: () => {
+        togglePresetCustomTheme();
+      },
+    },
     {
       id: "changeDifficulty",
       display: "Change difficulty...",
diff --git a/public/js/userconfig.js b/public/js/userconfig.js
index 1a72dbb4d..ba0ccf173 100644
--- a/public/js/userconfig.js
+++ b/public/js/userconfig.js
@@ -609,6 +609,31 @@ function applyCustomThemeColors() {
   }, 500);
 }
 
+function togglePresetCustomTheme() {
+  if (config.customTheme) {
+    setCustomTheme(false);
+    applyCustomThemeColors();
+    // $('[tabContent="custom"]').removeClass("reveal");
+    // $('[tabContent="preset"]').addClass("reveal");
+    swapElements(
+      $('.pageSettings [tabContent="custom"]'),
+      $('.pageSettings [tabContent="preset"]'),
+      250
+    );
+  } else {
+    setCustomTheme(true);
+    applyCustomThemeColors();
+    swapElements(
+      $('.pageSettings [tabContent="preset"]'),
+      $('.pageSettings [tabContent="custom"]'),
+      250
+    );
+
+    // $('[tabContent="preset"]').removeClass("reveal");
+    // $('[tabContent="custom"]').addClass("reveal");
+  }
+}
+
 function updateFavicon(size, curveSize) {
   let maincolor, bgcolor;