Math

Getting Started

Fumadocs doesn't bundle with other plugins, you have to manually install those plugins.

npm install remark-math rehype-katex katex

Add Plugins

Add the remark/rehype plugins you have installed above.

The code might be vary depending on your content source, here is an example for Fumadocs MDX:

import rehypeKatex from 'rehype-katex';
import remarkMath from 'remark-math';
import { defineConfig } from 'fumadocs-mdx/config';
 
export default defineConfig({
  mdxOptions: {
    remarkPlugins: [remarkMath],
    // Place it at first so that it won't be changed by syntax highlighter
    rehypePlugins: (v) => [rehypeKatex, ...v],
  },
});

Add Stylesheet

In order to make it looks great on the client, add the following to root layout:

layout.tsx

import 'katex/dist/katex.css';

Done

Type some TeX expression in your documents

```math
c = \pm\sqrt{a^2 + b^2}
```

c = \pm\sqrt{a^2 + b^2}

Long equations example

\displaystyle {\begin{aligned}T_{f}(z)&=\sum _{k=0}^{\infty }{\frac {(z-c)^{k}}{2\pi i}}\int _{\gamma }{\frac {f(w)}{(w-c)^{k+1}}}\,dw\\&={\frac {1}{2\pi i}}\int _{\gamma }{\frac {f(w)}{w-c}}\sum _{k=0}^{\infty }\left({\frac {z-c}{w-c}}\right)^{k}\,dw\\&={\frac {1}{2\pi i}}\int _{\gamma }{\frac {f(w)}{w-c}}\left({\frac {1}{1-{\frac {z-c}{w-c}}}}\right)\,dw\\&={\frac {1}{2\pi i}}\int _{\gamma }{\frac {f(w)}{w-z}}\,dw=f(z),\end{aligned}}

Getting Started

Add Plugins

Add Stylesheet

Done

On this page