diff --git a/src/public/translations/en/translation.json b/src/public/translations/en/translation.json
index 62729a924..5d6b0221a 100644
--- a/src/public/translations/en/translation.json
+++ b/src/public/translations/en/translation.json
@@ -376,7 +376,7 @@
     "auto_read_only_disabled": "text/code notes can be set automatically into read mode when they are too large. You can disable this behavior on per-note basis by adding this label to the note",
     "app_css": "marks CSS notes which are loaded into the Trilium application and can thus be used to modify Trilium's looks.",
     "app_theme": "marks CSS notes which are full Trilium themes and are thus available in Trilium options.",
-    "app_theme_base": "set to \"next\" in order to use the TriliumNext theme as a base for a custom theme instead of the legacy one.",
+    "app_theme_base": "set to \"next\", \"next-light\", or \"next-dark\" to use the corresponding TriliumNext theme (auto, light or dark) as the base for a custom theme, instead of the legacy one.",
     "css_class": "value of this label is then added as CSS class to the node representing given note in the tree. This can be useful for advanced theming. Can be used in template notes.",
     "icon_class": "value of this label is added as a CSS class to the icon on the tree which can help visually distinguish the notes in the tree. Example might be bx bx-home - icons are taken from boxicons. Can be used in template notes.",
     "page_size": "number of items per page in note listing",
diff --git a/src/routes/index.ts b/src/routes/index.ts
index 966f71ab3..e7cd36228 100644
--- a/src/routes/index.ts
+++ b/src/routes/index.ts
@@ -37,7 +37,7 @@ function index(req: Request, res: Response) {
         device: view,
         csrfToken: csrfToken,
         themeCssUrl: getThemeCssUrl(theme, themeNote),
-        themeUseNextAsBase: themeNote?.getAttributeValue("label", "appThemeBase") === "next",
+        themeUseNextAsBase: themeNote?.getAttributeValue("label", "appThemeBase"),
         headingStyle: options.headingStyle,
         layoutOrientation: options.layoutOrientation,
         platform: process.platform,
diff --git a/src/views/desktop.ejs b/src/views/desktop.ejs
index 6896eeba8..40f369c85 100644
--- a/src/views/desktop.ejs
+++ b/src/views/desktop.ejs
@@ -53,8 +53,12 @@
 <link href="<%= themeCssUrl %>" rel="stylesheet">
 <% } %>
 
-<% if (themeUseNextAsBase) { %>
-<link href="<%= assetPath %>/stylesheets/theme-next.css" rel="stylesheet">
+<% if (themeUseNextAsBase === "next") { %>
+  <link href="<%= assetPath %>/stylesheets/theme-next.css" rel="stylesheet">
+<% } else if (themeUseNextAsBase === "next-dark") { %>
+  <link href="<%= assetPath %>/stylesheets/theme-next-dark.css" rel="stylesheet">
+<% } else if (themeUseNextAsBase === "next-light") { %>
+  <link href="<%= assetPath %>/stylesheets/theme-next-light.css" rel="stylesheet">
 <% } %>
 
 <link href="<%= assetPath %>/stylesheets/style.css" rel="stylesheet">