Math Equations

KaTeX math equation support using the MathBlock JSX component.

When math is enabled in settings (default: true), you can render mathematical equations using KaTeX via the <MathBlock> JSX component.

Inline Math

Use <MathBlock latex="..." /> (without the block prop) to embed math within a line of text.

The formula $E = mc^2$ is inline.

The formula <MathBlock latex="E = mc^2" /> is inline.

Block Math

Add the block prop to render a centered display equation.

<MathBlock latex="\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}" block />

Configuration

Math support is controlled by the math field in zfb.config.ts:

export default defineConfig(
  zudoDoc({
    // ...
    math: true, // enabled by default
  }),
);

More Examples

Quadratic Formula

<MathBlock latex="x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}" block />

Summation

<MathBlock latex="\sum_{i=1}^{n} i = \frac{n(n+1)}{2}" block />

Matrix

<MathBlock latex="\begin{bmatrix} a & b \\ c & d \end{bmatrix} \begin{bmatrix} x \\ y \end{bmatrix} = \begin{bmatrix} ax + by \\ cx + dy \end{bmatrix}" block />