diff --git a/packages/ui-default/components/katex/katex.page.js b/packages/ui-default/components/katex/katex.page.js
new file mode 100644
index 000000000..f3a4c970b
--- /dev/null
+++ b/packages/ui-default/components/katex/katex.page.js
@@ -0,0 +1,26 @@
+import $ from 'jquery';
+import { AutoloadPage } from 'vj/misc/Page';
+
+const katexPage = new AutoloadPage('katexPage', () => {
+  import('katex/contrib/auto-render/auto-render').then(({ default: katex }) => {
+    function runKatex($containers) {
+      $containers.get().forEach((container) => katex(container, {
+        delimiters: [
+          { left: '$$', right: '$$', display: true },
+          { left: '$', right: '$', display: false },
+          { left: '\\(', right: '\\)', display: false },
+          { left: '\\[', right: '\\]', display: true },
+          { left: '\\begin{equation}', right: '\\end{equation}', display: true },
+          { left: '\\begin{align}', right: '\\end{align}', display: true },
+          { left: '\\begin{alignat}', right: '\\end{alignat}', display: true },
+          { left: '\\begin{gather}', right: '\\end{gather}', display: true },
+          { left: '\\begin{CD}', right: '\\end{CD}', display: true },
+        ],
+      }));
+    }
+    runKatex($('.typo'));
+    $(document).on('vjContentNew', (e) => runKatex($(e.target).find('.typo')));
+  });
+});
+
+export default katexPage;
diff --git a/packages/ui-default/components/katex.page.styl b/packages/ui-default/components/katex/katex.page.styl
similarity index 100%
rename from packages/ui-default/components/katex.page.styl
rename to packages/ui-default/components/katex/katex.page.styl
diff --git a/packages/ui-default/package.json b/packages/ui-default/package.json
index 76ec8728c..0120edf2a 100644
--- a/packages/ui-default/package.json
+++ b/packages/ui-default/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.39.12",
+  "version": "4.39.13",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",