Math and Diagrams

中文: 中文 · Markdown Syntax · MOC-English Docs

Inimark ships KaTeX and Mermaid, with familiar academic / engineering markup. Each example below shows source first, then the rendered result.

How to write (methods first)

Need	Use
A symbol inside a sentence	Inline $…$
A displayed equation	Block `$$…$$` on its own lines
Architecture / flow / sequence	```mermaid fence
Fine-tune a large block	Editing Modes › Source mode, then flip back

Shortcuts: insert a math block with Alt + Ctrl/⌘ + B. After editing dense LaTeX or Mermaid, preview in WYSIWYG; if a fence fails to render, check spelling and diagram type support for your Mermaid build.

Pick a diagram by scenario

Scenario	Mermaid type
Process / decision	`flowchart`
API or user journey over time	`sequenceDiagram` / `journey`
Domain model	`classDiagram` / `erDiagram`
Release plan	`gantt` / `timeline`
Brainstorm structure	`mindmap`

Publish packs KaTeX assets so formulas stay consistent on the static site — see Publish a Site.

Inline math

Source:

Mass–energy: $E = mc^2$

Euler’s identity: $e^{i\pi} + 1 = 0$

Pythagoras: $a^2 + b^2 = c^2$

Rendered:

Mass–energy: $E = m c^{2}$

Euler’s identity: $e^{i π} + 1 = 0$

Pythagoras: $a^{2} + b^{2} = c^{2}$

Block math

Bayes’ theorem

Source:

$$
P(A\mid B) = \frac{P(B\mid A)\,P(A)}{P(B)}
$$

Rendered:

P(A\mid B) = \frac{P(B\mid A)\,P(A)}{P(B)}

P (A ∣ B) = \frac{P (B ∣ A) P (A)}{P (B)}

Matrix product

Source:

$$
\begin{pmatrix}
a & b \\
c & d
\end{pmatrix}
\begin{pmatrix}
x \\
y
\end{pmatrix}
=
\begin{pmatrix}
ax + by \\
cx + dy
\end{pmatrix}
$$

Rendered:

\begin{pmatrix} a & b \\ c & d \end{pmatrix} \begin{pmatrix} x \\ y \end{pmatrix} = \begin{pmatrix} ax + by \\ cx + dy \end{pmatrix}

(\begin{matrix} a & b \\ c & d \end{matrix}) (\begin{matrix} x \\ y \end{matrix}) = (\begin{matrix} a x + b y \\ c x + d y \end{matrix})

Gaussian integral

Source:

$$
\int_{-\infty}^{\infty} e^{-x^{2}}\,dx = \sqrt{\pi}
$$

Rendered:

\int_{-\infty}^{\infty} e^{-x^{2}}\,dx = \sqrt{\pi}

\int_{- \infty}^{\infty} e^{- x^{2}} d x = \sqrt{π}

Taylor series (exponential)

Source:

$$
e^{x} = \sum_{n=0}^{\infty} \frac{x^{n}}{n!} = 1 + x + \frac{x^{2}}{2!} + \frac{x^{3}}{3!} + \cdots
$$

Rendered:

e^{x} = \sum_{n=0}^{\infty} \frac{x^{n}}{n!} = 1 + x + \frac{x^{2}}{2!} + \frac{x^{3}}{3!} + \cdots

e^{x} = \sum_{n = 0}^{\infty} \frac{x^{n}}{n!} = 1 + x + \frac{x^{2}}{2!} + \frac{x^{3}}{3!} + \dots

Fourier transform

Source:

$$
\hat{f}(\xi) = \int_{-\infty}^{\infty} f(x)\,e^{-2\pi i x\xi}\,dx
$$

Rendered:

\hat{f}(\xi) = \int_{-\infty}^{\infty} f(x)\,e^{-2\pi i x\xi}\,dx

\hat{f} (ξ) = \int_{- \infty}^{\infty} f (x) e^{- 2 π i x ξ} d x

Time-dependent Schrödinger equation

Source:

$$
i\hbar\frac{\partial}{\partial t}\Psi(\mathbf{r}, t) = \hat{H}\Psi(\mathbf{r}, t)
$$

Rendered:

i\hbar\frac{\partial}{\partial t}\Psi(\mathbf{r}, t) = \hat{H}\Psi(\mathbf{r}, t)

i ℏ \frac{\partial}{\partial t} Ψ (r, t) = \hat{H} Ψ (r, t)

Maxwell’s equations

Source:

$$
\begin{aligned}
\nabla\cdot\mathbf{E} &= \frac{\rho}{\varepsilon_{0}} \\
\nabla\cdot\mathbf{B} &= 0 \\
\nabla\times\mathbf{E} &= -\frac{\partial\mathbf{B}}{\partial t} \\
\nabla\times\mathbf{B} &= \mu_{0}\mathbf{J} + \mu_{0}\varepsilon_{0}\frac{\partial\mathbf{E}}{\partial t}
\end{aligned}
$$

Rendered:

\begin{aligned} \nabla\cdot\mathbf{E} &= \frac{\rho}{\varepsilon_{0}} \\ \nabla\cdot\mathbf{B} &= 0 \\ \nabla\times\mathbf{E} &= -\frac{\partial\mathbf{B}}{\partial t} \\ \nabla\times\mathbf{B} &= \mu_{0}\mathbf{J} + \mu_{0}\varepsilon_{0}\frac{\partial\mathbf{E}}{\partial t} \end{aligned}

\begin{matrix} \nabla \cdot E & = \frac{ρ}{ε_{0}} \\ \nabla \cdot B & = 0 \\ \nabla \times E & = - \frac{\partial B}{\partial t} \\ \nabla \times B & = μ_{0} J + μ_{0} ε_{0} \frac{\partial E}{\partial t} \end{matrix}

Euler–Lagrange equation

Source:

$$
\frac{d}{dt}\left(\frac{\partial L}{\partial \dot{q}_{i}}\right) - \frac{\partial L}{\partial q_{i}} = 0
$$

Rendered:

\frac{d}{dt}\left(\frac{\partial L}{\partial \dot{q}_{i}}\right) - \frac{\partial L}{\partial q_{i}} = 0

\frac{d}{d t} (\frac{\partial L}{\partial {\dot{q}}_{i}}) - \frac{\partial L}{\partial q_{i}} = 0

Einstein field equations

Source:

$$
R_{\mu\nu} - \frac{1}{2}Rg_{\mu\nu} + \Lambda g_{\mu\nu} = \frac{8\pi G}{c^{4}}T_{\mu\nu}
$$

Rendered:

R_{\mu\nu} - \frac{1}{2}Rg_{\mu\nu} + \Lambda g_{\mu\nu} = \frac{8\pi G}{c^{4}}T_{\mu\nu}

R_{μ ν} - \frac{1}{2} R g_{μ ν} + Λ g_{μ ν} = \frac{8 π G}{c^{4}} T_{μ ν}

Incompressible Navier–Stokes

Source:

$$
\rho\left(\frac{\partial\mathbf{u}}{\partial t} + \mathbf{u}\cdot\nabla\mathbf{u}\right) = -\nabla p + \mu\nabla^{2}\mathbf{u} + \mathbf{f}
$$

Rendered:

\rho\left(\frac{\partial\mathbf{u}}{\partial t} + \mathbf{u}\cdot\nabla\mathbf{u}\right) = -\nabla p + \mu\nabla^{2}\mathbf{u} + \mathbf{f}

ρ (\frac{\partial u}{\partial t} + u \cdot \nabla u) = - \nabla p + μ \nabla^{2} u + f

Cauchy’s integral formula

Source:

$$
f(a) = \frac{1}{2\pi i}\oint_{C}\frac{f(z)}{z-a}\,dz
$$

Rendered:

f(a) = \frac{1}{2\pi i}\oint_{C}\frac{f(z)}{z-a}\,dz

f (a) = \frac{1}{2 π i} \oint_{C} \frac{f (z)}{z - a} d z

Black–Scholes PDE

Source:

$$
\frac{\partial V}{\partial t} + \frac{1}{2}\sigma^{2}S^{2}\frac{\partial^{2}V}{\partial S^{2}} + rS\frac{\partial V}{\partial S} - rV = 0
$$

Rendered:

\frac{\partial V}{\partial t} + \frac{1}{2}\sigma^{2}S^{2}\frac{\partial^{2}V}{\partial S^{2}} + rS\frac{\partial V}{\partial S} - rV = 0

\frac{\partial V}{\partial t} + \frac{1}{2} σ^{2} S^{2} \frac{\partial^{2} V}{\partial S^{2}} + r S \frac{\partial V}{\partial S} - r V = 0

Tweak large formulas in source mode, then return to WYSIWYG.

Mermaid diagram gallery

Each diagram shows copyable source first, then the rendered chart. Write Mermaid in a ```mermaid fence to render.

Flowchart

Source:

flowchart LR
  Note[Note] -->|"[[wikilink]]"| Note2[Another note]
  Note2 --> Graph[Graph]
  Note --> Site[Published site]

Rendered:

flowchart LR
  Note[Note] -->|"[[wikilink]]"| Note2[Another note]
  Note2 --> Graph[Graph]
  Note --> Site[Published site]

Sequence diagram

Source:

sequenceDiagram
  participant Author
  participant Editor
  participant SSG
  Author->>Editor: Write Markdown
  Author->>SSG: Publish
  SSG-->>Author: Static HTML

Rendered:

sequenceDiagram
  participant Author
  participant Editor
  participant SSG
  Author->>Editor: Write Markdown
  Author->>SSG: Publish
  SSG-->>Author: Static HTML

Class diagram

Source:

classDiagram
  class Note {
    +string path
    +string body
    +save()
  }
  class Library {
    +string root
    +open(path)
  }
  Library "1" --> "*" Note : contains

Rendered:

classDiagram
  class Note {
    +string path
    +string body
    +save()
  }
  class Library {
    +string root
    +open(path)
  }
  Library "1" --> "*" Note : contains

State diagram

Source:

stateDiagram-v2
  [*] --> Idle
  Idle --> Editing: open note
  Editing --> Preview: Publish
  Preview --> Editing: keep editing
  Editing --> [*]: close

Rendered:

stateDiagram-v2
  [*] --> Idle
  Idle --> Editing: open note
  Editing --> Preview: Publish
  Preview --> Editing: keep editing
  Editing --> [*]: close

Entity-relationship diagram

Source:

erDiagram
  LIBRARY ||--o{ NOTE : contains
  NOTE ||--o{ LINK : has
  NOTE {
    string path
    string title
  }
  LINK {
    string target
  }

Rendered:

erDiagram
  LIBRARY ||--o{ NOTE : contains
  NOTE ||--o{ LINK : has
  NOTE {
    string path
    string title
  }
  LINK {
    string target
  }

Gantt chart

Source:

gantt
  title Help-vault writing cadence
  dateFormat  YYYY-MM-DD
  section Content
  Install and welcome     :a1, 2026-09-01, 3d
  Markdown and math       :a2, after a1, 4d
  section Publish
  Themes and site         :b1, after a2, 3d

Rendered:

gantt
  title Help-vault writing cadence
  dateFormat  YYYY-MM-DD
  section Content
  Install and welcome     :a1, 2026-09-01, 3d
  Markdown and math       :a2, after a1, 4d
  section Publish
  Themes and site         :b1, after a2, 3d

Pie chart

Source:

pie showData
  title Time spent on notes (sketch)
  "Writing" : 45
  "Wikilinks" : 25
  "Theme & publish" : 20
  "Other" : 10

Rendered:

pie showData
  title Time spent on notes (sketch)
  "Writing" : 45
  "Wikilinks" : 25
  "Theme & publish" : 20
  "Other" : 10

Mind map

Source:

mindmap
  root((Inimark))
    Edit
      WYSIWYG
      Source mode
    Knowledge
      Vault
      Wikilinks
      Graph
    Publish
      Themes
      Static site

Rendered:

mindmap
  root((Inimark))
    Edit
      WYSIWYG
      Source mode
    Knowledge
      Vault
      Wikilinks
      Graph
    Publish
      Themes
      Static site

Timeline

Source:

timeline
  title Inimark reading path
  section Start
    Install : Download Releases
    UI : Learn shell and editor
  section Depth
    Markdown : Syntax and formulas
    Links : Connect notes
  section Output
    Publish : Export a static site

Rendered:

timeline
  title Inimark reading path
  section Start
    Install : Download Releases
    UI : Learn shell and editor
  section Depth
    Markdown : Syntax and formulas
    Links : Connect notes
  section Output
    Publish : Export a static site

Git graph

Source:

gitGraph
  commit id: "init"
  branch feature
  checkout feature
  commit id: "docs"
  checkout main
  merge feature
  commit id: "release"

Rendered:

gitGraph
  commit id: "init"
  branch feature
  checkout feature
  commit id: "docs"
  checkout main
  merge feature
  commit id: "release"

User journey

Source:

journey
  title From install to publish
  section Install
    Open Releases: 5: User
    Install app: 4: User
  section Write
    Open docs vault: 5: User
    Edit notes: 5: User
  section Publish
    Publish preview: 4: User

Rendered:

journey
  title From install to publish
  section Install
    Open Releases: 5: User
    Install app: 4: User
  section Write
    Open docs vault: 5: User
    Edit notes: 5: User
  section Publish
    Publish preview: 4: User

Quadrant chart

Source:

quadrantChart
  title Feature trade-offs (sketch)
  x-axis Low effort --> High effort
  y-axis Low value --> High value
  quadrant-1 Do first
  quadrant-2 Evaluate
  quadrant-3 Deprioritize
  quadrant-4 Be careful
  WYSIWYG: [0.7, 0.85]
  Wikilink graph: [0.65, 0.8]
  Publish: [0.55, 0.75]
  Plugin market: [0.9, 0.35]

Rendered:

quadrantChart
  title Feature trade-offs (sketch)
  x-axis Low effort --> High effort
  y-axis Low value --> High value
  quadrant-1 Do first
  quadrant-2 Evaluate
  quadrant-3 Deprioritize
  quadrant-4 Be careful
  WYSIWYG: [0.7, 0.85]
  Wikilink graph: [0.65, 0.8]
  Publish: [0.55, 0.75]
  Plugin market: [0.9, 0.35]

Requirement diagram

Source:

requirementDiagram
  requirement stable {
    id: R1
    text: "Math and diagrams render in WYSIWYG"
    risk: low
    verifymethod: test
  }
  element editor {
    type: component
  }
  editor - satisfies -> stable

Rendered:

requirementDiagram
  requirement stable {
    id: R1
    text: "Math and diagrams render in WYSIWYG"
    risk: low
    verifymethod: test
  }
  element editor {
    type: component
  }
  editor - satisfies -> stable

Newer Mermaid kinds (e.g. sankey, xychart, block) depend on the bundled Mermaid build. The gallery above sticks to common, stable types.

Publishing

Publish packs KaTeX assets so formulas survive on the static site. See Publish a Site and Themes and Appearance.

Prev: Code and Syntax Highlighting · Next: Find Replace and Shortcuts