Skip to main content
The @streamdown/math package renders mathematical expressions using KaTeX. It provides remark and rehype plugins that parse and render $...$ inline math and $$...$$ block math, and integrates with the plugins.math field on <Streamdown>.

Installation

npm install @streamdown/math
You must also import the KaTeX stylesheet in your application. Add the following import at the top of your root layout or CSS entry point:
import "katex/dist/katex.min.css";

Quick start

import { createMathPlugin } from "@streamdown/math";
import { Streamdown } from "streamdown";
import "katex/dist/katex.min.css";

const plugins = {
  math: createMathPlugin(),
};

<Streamdown plugins={plugins}>
  {markdown}
</Streamdown>

createMathPlugin()

Creates a MathPlugin instance with optional configuration.
function createMathPlugin(options?: MathPluginOptions): MathPlugin
options
MathPluginOptions
Optional configuration for the plugin.
A pre-configured instance with default settings is also exported:
import { math } from "@streamdown/math";

MathPlugin interface

type
math
required
Discriminant for the plugin union type. Always "math".
name
katex
required
Plugin identifier. Always "katex".
remarkPlugin
Pluggable
required
A unified Pluggable that configures remark-math to parse math syntax in the Markdown AST. Streamdown adds this to the remark pipeline automatically when the plugin is present.
rehypePlugin
Pluggable
required
A unified Pluggable that configures rehype-katex to render math nodes as KaTeX HTML. Streamdown adds this to the rehype pipeline automatically when the plugin is present.
getStyles
() => string
Returns the path to the KaTeX CSS file ("katex/dist/katex.min.css"). You should import this stylesheet in your application rather than calling this method; it is provided as a reference.

Math syntax

With the plugin enabled, the following syntax is supported: Inline math — wrap an expression in $...$:
The quadratic formula is $x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}$.
Single-dollar inline math is disabled by default. Pass singleDollarTextMath: true to createMathPlugin() to enable it.
Block math — wrap a multi-line expression in $$...$$:
$$
\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}
$$
Inline KaTeX via double-dollar — use $$...$$ inline without surrounding newlines:
Euler's identity: $$e^{i\pi} + 1 = 0$$

Plugin ordering

Streamdown inserts remarkPlugin and rehypePlugin in the correct position relative to other plugins:
  • remarkPlugin runs after remark-gfm and any CJK remark plugins.
  • rehypePlugin runs after the default rehype sanitisation plugins.
This ordering is handled automatically; you do not need to configure it manually.

Build docs developers (and LLMs) love