# gatsby-remark-katex

> Transform math nodes to html markup

Latest version **7.16.0** (published 2026-01-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install gatsby-remark-katex
pnpm add gatsby-remark-katex
yarn add gatsby-remark-katex
bun add gatsby-remark-katex
```

## Health

**Score 60/100 (C)** — status: stable.

Positive: no vulnerabilities; high maintenance score; popular repo; extremely popular.

Warnings: low downloads; no types; no esm support.

## Facts

| | |
|---|---|
| Version | 7.16.0 |
| Published | 2026-01-26 |
| First published | 2017-08-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=18.0.0 <26 |
| Dependencies | 5 |
| Unpacked size | 145 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 55939 |
| Author | Jeffrey Xiao |
| Maintainers | pieh, kathmbeck, serhalp-netlify, mlgualtieri-gatsby, fk, tylerbarnes, daniellewgatsby |
| Keywords | gatsby, gatsby-plugin, katex, remark |

## Links

- npm: https://www.npmjs.com/package/gatsby-remark-katex
- Repository: https://github.com/gatsbyjs/gatsby
- Homepage: https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-remark-katex#readme
- Issues: https://github.com/gatsbyjs/gatsby/issues
- npm.io page: https://npm.io/package/gatsby-remark-katex

## Dependencies (5)

- [unified](https://npm.io/package/unified.md) ^9.2.2
- [remark-math](https://npm.io/package/remark-math.md) ^4.0.0
- [rehype-parse](https://npm.io/package/rehype-parse.md) ^7.0.1
- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.20.13
- [unist-util-visit](https://npm.io/package/unist-util-visit.md) ^2.0.3

## Alternatives

- [@mdxeditor/editor](https://npm.io/package/@mdxeditor/editor.md) — 962.4K weekly downloads
- [mmdb-lib](https://npm.io/package/mmdb-lib.md) — 680.9K weekly downloads
- [playcanvas](https://npm.io/package/playcanvas.md) — 36.2K weekly downloads
- [@glw907/cairn-cms](https://npm.io/package/@glw907/cairn-cms.md) — 967 weekly downloads
- [markdown-to-confluence](https://npm.io/package/markdown-to-confluence.md) — 103 weekly downloads

## Recent versions

- 7.16.0 (latest) — 2026-01-26
- 7.17.0-next.0 (next) — 2025-11-27
- 7.17.0-react19.1 (react19) — 2025-11-26
- 5.12.0 (latest-v3) — 2022-12-07
- 6.25.0 (latest-v4) — 2022-12-07
- 7.0.0-alpha-drupal-proxyurl.14 (drupal-proxyurl) — 2022-11-22
- 6.14.0-alpha-transformer-json.26 (alpha-transformer-json) — 2022-10-12
- 7.0.0-alpha-v5.d20221012t101120.57 (alpha-v5) — 2022-10-12
- 6.23.0-alpha-a5-peer.70 (alpha-a5-peer) — 2022-09-14
- 6.23.0-alpha-preview-gh-api.26 (preview-gh-api) — 2022-09-08
- 6.23.0-alpha-9689ff.25 (alpha-9689ff) — 2022-08-31
- 6.18.0-alpha-drupal-self-reference.18 (drupal-self-reference) — 2022-07-19
- 6.15.0-alpha-wp-image-cdn-auth.48 (wp-image-cdn-auth) — 2022-05-20
- 6.8.0-alpha-image-service.24 (image-service) — 2022-02-10
- 6.6.0-alpha-ts-jit.60 (alpha-ts-jit) — 2022-01-21
- … 329 more at https://npm.io/package/gatsby-remark-katex/versions

## README

# gatsby-remark-katex

[gatsby-remark-katex][1] adds math equation support to gatsby using
[remark-math][2] and [katex][3]. Live example at [using-remark.gatsbyjs.org/katex/](https://using-remark.gatsbyjs.org/katex/).

## Install

```shell
npm install gatsby-transformer-remark gatsby-remark-katex katex
```

## How to use

```javascript
// In your gatsby-config.js
plugins: [
  {
    resolve: `gatsby-transformer-remark`,
    options: {
      plugins: [
        {
          resolve: `gatsby-remark-katex`,
          options: {
            // Add any KaTeX options from https://github.com/KaTeX/KaTeX/blob/master/docs/options.md here
            strict: `ignore`
          }
        }
      ],
    },
  },
],
```

**Add Katex CSS to your template:** Katex's CSS file is required to render the formulas correctly. Include the CSS file in your template ([example][4]):

```javascript
require(`katex/dist/katex.min.css`)
```

### Math Equations in Inline Mode

Surround your equation with `$` to generate a math equation in inline mode.

**Example markdown:**

```markdown
$a^2 + b^2 = c^2$
```

### Math Equations in Display Mode

Surround your equation with `$$` and new-lines to generate a math equation in
display mode.

**Example markdown:**

```markdown
$$
a^2 + b^2 = c^2
$$
```

[1]: https://www.gatsbyjs.com/plugins/gatsby-remark-katex/
[2]: https://github.com/Rokt33r/remark-math
[3]: https://github.com/KaTeX/KaTeX
[4]: https://github.com/gatsbyjs/gatsby/blob/master/examples/using-remark/src/templates/template-blog-post.js

---
_Source: https://npm.io/package/gatsby-remark-katex · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._