diff --git a/src/services/code_block_theme.ts b/src/services/code_block_theme.ts
index ecf59d9b3..9aeb23651 100644
--- a/src/services/code_block_theme.ts
+++ b/src/services/code_block_theme.ts
@@ -9,6 +9,7 @@ import themeNames from "./code_block_theme_names.json" with { type: "json" }
 import { t } from "i18next";
 import { join } from "path";
 import { getResourceDir } from "./utils.js";
+import env from "./env.js";
 
 /**
  * Represents a color scheme for the code block syntax highlight.
@@ -30,7 +31,8 @@ interface ColorTheme {
  * @returns the supported themes, grouped.
  */
 export function listSyntaxHighlightingThemes() {
-    const path = join(getResourceDir(), "styles");
+    const stylesDir = (env.isDev() ? "node_modules/@highlightjs/cdn-assets/styles" : "styles");
+    const path = join(getResourceDir(), stylesDir);
     const systemThemes = readThemesFromFileSystem(path);
 
     return {