diff --git a/docs/index.html b/docs/index.html
index b70448457..57bb78d77 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -49,7 +49,7 @@
   <body>
     <div id="app"></div>
     <script type="module">
-      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
+      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@9/dist/mermaid.esm.min.mjs';
       window.mermaid = mermaid;
     </script>
     <script>
diff --git a/packages/mermaid/src/docs.mts b/packages/mermaid/src/docs.mts
index 2d1aa7620..f618165a3 100644
--- a/packages/mermaid/src/docs.mts
+++ b/packages/mermaid/src/docs.mts
@@ -41,7 +41,7 @@ import { remark } from 'remark';
 // @ts-ignore No typescript declaration file
 import flatmap from 'unist-util-flatmap';
 
-const version = (
+const MERMAID_MAJOR_VERSION = (
   JSON.parse(readFileSync('packages/mermaid/package.json', 'utf8')).version as string
 ).split('.')[0];
 
@@ -148,7 +148,7 @@ const readSyncedUTF8file = (filename: string): string => {
  * @param file {string} name of the file that will be verified
  */
 const transformMarkdown = (file: string) => {
-  const doc = readSyncedUTF8file(file).replace(/<MERMAID_VERSION>/g, version);
+  const doc = readSyncedUTF8file(file).replace(/<MERMAID_VERSION>/g, MERMAID_MAJOR_VERSION);
   const ast: Root = remark.parse(doc);
   const out = flatmap(ast, (c: Code) => {
     if (c.type !== 'code') {
@@ -189,7 +189,10 @@ const transformHtml = (filename: string) => {
    * @returns {string} The contents of the file with the comment inserted
    */
   const insertAutoGeneratedComment = (fileName: string): string => {
-    const fileContents = readSyncedUTF8file(fileName);
+    const fileContents = readSyncedUTF8file(fileName).replace(
+      /<MERMAID_VERSION>/g,
+      MERMAID_MAJOR_VERSION
+    );
     const jsdom = new JSDOM(fileContents);
     const htmlDoc = jsdom.window.document;
     const autoGeneratedComment = jsdom.window.document.createComment(AUTOGENERATED_TEXT);
diff --git a/packages/mermaid/src/docs/index.html b/packages/mermaid/src/docs/index.html
index d884c22a9..1c1d523c4 100644
--- a/packages/mermaid/src/docs/index.html
+++ b/packages/mermaid/src/docs/index.html
@@ -49,7 +49,7 @@
   <body>
     <div id="app"></div>
     <script type="module">
-      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
+      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@<MERMAID_VERSION>/dist/mermaid.esm.min.mjs';
       window.mermaid = mermaid;
     </script>
     <script>
