diff --git a/ts/editable/Mathjax.svelte b/ts/editable/Mathjax.svelte
index accac535a..79eb49367 100644
--- a/ts/editable/Mathjax.svelte
+++ b/ts/editable/Mathjax.svelte
@@ -6,7 +6,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     import { convertMathjax } from "./mathjax";
 
     export let mathjax: string;
-    export let type: "inline" | "block" | "chemistry";
+    export let block: boolean;
 
     $: converted = convertMathjax(mathjax);
     $: encoded = encodeURIComponent(converted);
@@ -14,7 +14,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
 <img
     src="data:image/svg+xml,{encoded}"
-    class:block={type === "block"}
+    class:block
     alt="Mathjax"
     data-anki="mathjax"
     data-mathjax={mathjax}
diff --git a/ts/editable/editable.ts b/ts/editable/editable.ts
index e817cb47d..187bb3ca1 100644
--- a/ts/editable/editable.ts
+++ b/ts/editable/editable.ts
@@ -25,7 +25,12 @@ function containsInlineContent(element: Element): boolean {
     return true;
 }
 
-const components = ["anki-mathjax-block", "anki-mathjax-inline"];
+interface DecoratedElement extends HTMLElement {
+    decorate(): void;
+    undecorate(): void;
+}
+
+const decoratedTags = ["anki-mathjax"];
 
 export class Editable extends HTMLElement {
     set fieldHTML(content: string) {
@@ -39,9 +44,9 @@ export class Editable extends HTMLElement {
     get fieldHTML(): string {
         const clone = this.cloneNode(true) as Element;
 
-        for (const component of components) {
+        for (const component of decoratedTags) {
             for (const element of clone.getElementsByTagName(component)) {
-                (element as any).undecorate();
+                (element as DecoratedElement).undecorate();
             }
         }
 
diff --git a/ts/editable/index.ts b/ts/editable/index.ts
index 157ced9e6..25bf9fa50 100644
--- a/ts/editable/index.ts
+++ b/ts/editable/index.ts
@@ -4,4 +4,4 @@
 import "./editable-base.css";
 import "./editable-container";
 import "./editable";
-import "./mathjax-components";
+import "./mathjax-component";
diff --git a/ts/editable/mathjax-component.ts b/ts/editable/mathjax-component.ts
new file mode 100644
index 000000000..f72a93278
--- /dev/null
+++ b/ts/editable/mathjax-component.ts
@@ -0,0 +1,72 @@
+import "mathjax/es5/tex-svg-full";
+
+import Mathjax_svelte from "./Mathjax.svelte";
+
+class Mathjax extends HTMLElement {
+    block: boolean = false;
+
+    static get observedAttributes(): string[] {
+        return ["block"];
+    }
+
+    connectedCallback(): void {
+        this.decorate();
+    }
+
+    attributeChangedCallback(_name: string, _old: string, newValue: string): void {
+        this.block = newValue !== "false";
+    }
+
+    decorate(): void {
+        const mathjax = (this.dataset.mathjax = this.innerText);
+        this.innerHTML = "";
+
+        new Mathjax_svelte({
+            target: this,
+            props: { mathjax, block: this.block },
+        });
+    }
+
+    undecorate(): void {
+        this.innerHTML = this.dataset.mathjax ?? "";
+        delete this.dataset.mathjax;
+
+        if (this.block) {
+            this.setAttribute("block", "true");
+        } else {
+            this.removeAttribute("block");
+        }
+    }
+}
+
+customElements.define("anki-mathjax", Mathjax);
+
+// TODO mathjax regex will prob. fail at double quotes
+const mathjaxTagPattern =
+    /<anki-mathjax(?:[^>]*?block="(.*?)")?[^>]*?>(.*?)<\/anki-mathjax>/gsu;
+
+export function toMathjaxDelimiters(html: string): string {
+    return html.replace(
+        mathjaxTagPattern,
+        (_match: string, block: string | undefined, text: string) =>
+            typeof block === "string" && block !== "false"
+                ? `\\[${text}\\]`
+                : `\\(${text}\\)`
+    );
+}
+
+const mathjaxBlockDelimiterPattern = /\\\[(.*?)\\\]/gsu;
+const mathjaxInlineDelimiterPattern = /\\\((.*?)\\\)/gsu;
+
+export function toMathjaxTags(html: string): string {
+    return html
+        .replace(
+            mathjaxBlockDelimiterPattern,
+            (_match: string, text: string) =>
+                `<anki-mathjax block="true">${text}</anki-mathjax>`
+        )
+        .replace(
+            mathjaxInlineDelimiterPattern,
+            (_match: string, text: string) => `<anki-mathjax>${text}</anki-mathjax>`
+        );
+}
diff --git a/ts/editable/mathjax-components.ts b/ts/editable/mathjax-components.ts
deleted file mode 100644
index 7da335ce9..000000000
--- a/ts/editable/mathjax-components.ts
+++ /dev/null
@@ -1,84 +0,0 @@
-import Mathjax_svelte from "./Mathjax.svelte";
-
-class MathjaxInline extends HTMLElement {
-    connectedCallback() {
-        this.decorate();
-    }
-
-    decorate(): void {
-        const mathjax = (this.dataset.mathjax = this.innerText);
-        const type = "inline";
-        this.innerHTML = "";
-
-        new Mathjax_svelte({
-            target: this,
-            props: { mathjax, type },
-        });
-    }
-
-    undecorate(): void {
-        this.innerHTML = this.dataset.mathjax ?? "";
-        delete this.dataset.mathjax;
-    }
-}
-
-customElements.define("anki-mathjax-inline", MathjaxInline);
-
-class MathjaxBlock extends HTMLElement {
-    connectedCallback() {
-        this.decorate();
-    }
-
-    decorate(): void {
-        const mathjax = (this.dataset.mathjax = this.innerText);
-        const type = "block";
-        this.innerHTML = "";
-
-        new Mathjax_svelte({
-            target: this,
-            props: { mathjax, type },
-        });
-    }
-
-    undecorate(): void {
-        this.innerHTML = this.dataset.mathjax ?? "";
-        delete this.dataset.mathjax;
-    }
-}
-
-customElements.define("anki-mathjax-block", MathjaxBlock);
-
-// TODO mathjax regex will prob. fail at double quotes
-const mathjaxInlineTagPattern =
-    /<anki-mathjax-inline[^>]*?data-mathjax="(.*?)"[^>]*?>.*?<\/anki-mathjax-inline>/gsu;
-const mathjaxBlockTagPattern =
-    /<anki-mathjax-block[^>]*?data-mathjax="(.*?)"[^>]*?>.*?<\/anki-mathjax-block>/gsu;
-
-export function toMathjaxDelimiters(html: string): string {
-    return html
-        .replace(
-            mathjaxInlineTagPattern,
-            (_match: string, text: string) => `\\(${text}\\)`
-        )
-        .replace(
-            mathjaxBlockTagPattern,
-            (_match: string, text: string) => `\\[${text}\\]`
-        );
-}
-
-const mathjaxInlineDelimiterPattern = /\\\((.*?)\\\)/gsu;
-const mathjaxBlockDelimiterPattern = /\\\[(.*?)\\\]/gsu;
-
-export function toMathjaxTags(html: string): string {
-    return html
-        .replace(
-            mathjaxInlineDelimiterPattern,
-            (_match: string, text: string) =>
-                `<anki-mathjax-inline>${text}</anki-mathjax-inline>`
-        )
-        .replace(
-            mathjaxBlockDelimiterPattern,
-            (_match: string, text: string) =>
-                `<anki-mathjax-block>${text}</anki-mathjax-block>`
-        );
-}
diff --git a/ts/editable/mathjax.ts b/ts/editable/mathjax.ts
index ba360bc66..2f6e8b5db 100644
--- a/ts/editable/mathjax.ts
+++ b/ts/editable/mathjax.ts
@@ -1,8 +1,6 @@
 // Copyright: Ankitects Pty Ltd and contributors
 // License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
-import "mathjax/es5/tex-svg-full";
-
 export function convertMathjax(input: string): string {
     const svg = globalThis.MathJax.tex2svg(input).children[0];
 
diff --git a/ts/editor/codable.ts b/ts/editor/codable.ts
index 2774a4faf..3839c9551 100644
--- a/ts/editor/codable.ts
+++ b/ts/editor/codable.ts
@@ -21,9 +21,7 @@ const latex = {
 const htmlanki = {
     name: "htmlmixed",
     tags: {
-        "anki-mathjax-inline": [[null, null, latex]],
-        "anki-mathjax-block": [[null, null, latex]],
-        "anki-mathjax-chemistry": [[null, null, latex]],
+        "anki-mathjax": [[null, null, latex]],
     },
 };
 
diff --git a/ts/editor/editing-area.ts b/ts/editor/editing-area.ts
index ee226995d..7da073e11 100644
--- a/ts/editor/editing-area.ts
+++ b/ts/editor/editing-area.ts
@@ -17,7 +17,7 @@ import { bridgeCommand } from "./lib";
 import { onInput, onKey, onKeyUp } from "./input-handlers";
 import { onFocus, onBlur } from "./focus-handlers";
 import { nightModeKey } from "components/context-keys";
-import { toMathjaxTags, toMathjaxDelimiters } from "editable/mathjax-components";
+import { toMathjaxTags, toMathjaxDelimiters } from "editable/mathjax-component";
 
 function onCutOrCopy(): void {
     bridgeCommand("cutOrCopy");
diff --git a/ts/editor/index.ts b/ts/editor/index.ts
index cc4b32317..c183cfe48 100644
--- a/ts/editor/index.ts
+++ b/ts/editor/index.ts
@@ -29,7 +29,7 @@ import type { EditorField } from "./editor-field";
 import { EditingArea } from "./editing-area";
 import "editable/editable-container";
 import "editable/editable";
-import "editable/mathjax-components";
+import "editable/mathjax-component";
 
 import { initToolbar, fieldFocused } from "./toolbar";
 import { initTagEditor } from "./tag-editor";