Math

Render LaTeX equations with KaTeX.

Inline math

use InlineMath for equations within text.

mdx

the equation <InlineMath>E = mc^2</InlineMath> is famous.

use BlockMath for standalone equations.

mdx

<BlockMath>x^2 + y^2 = r^2</BlockMath>

The base Math component with display mode option.

mdx

<Math>a + b = c</Math>
<Math display>a + b = c</Math>

prop	type	default	description
children	ReactNode	required	LaTeX expression
display	boolean	false	Block mode with centering

prop	type	default	description
children	ReactNode	required	LaTeX expression

prop	type	default	description
children	ReactNode	required	LaTeX expression

Requires KaTeX as a peer dependency.

bash

bun add katex

Add KaTeX CSS to your layout:

tsx

// in layout.tsx
import "katex/dist/katex.min.css";