TanStack
Highlight
Syntax highlighting for docs

TanStackHighlight

alpha

Highlight code without shipping an editor engine.

Register only the languages you use, run synchronously on either side of hydration, and emit one compact class-based HTML tree for every theme.

1.7 ThousandTotal Downloads155Weekly Downloads1GitHub Stars
Read the docs
3.9 KB
core + TSX gzip
25
shipped languages
1 tree
every color theme
highlight.tsdeterministic output
import { createHighlighter } from '@tanstack/highlight/core'
import { tsx } from '@tanstack/highlight/languages/tsx'
const highlighter = createHighlighter({ languages: [tsx] })
const result = highlighter.highlight(code, {
lang: 'tsx',
lineNumbers: true,
highlight: [2, 4, 5],
})
tsxcsshtmlmarkdown
Why Highlight

Small enough to understand. Specific enough to trust.

Pay for registered languages.

Import TSX, CSS, HTML, or the exact grammar set your docs need instead of an all-language bundle.

Synchronous on server and client.

The same registration produces identical markup during SSR and hydration with no initialization phase.

Themes are CSS, not duplicated markup.

Stable semantic token classes let light and dark themes switch without highlighting the source twice.

Annotations without a transformer stack.

Titles, line numbers, highlights, insertions, deletions, focus, warnings, and exact ranges are built in.

  1. 01 / Register

    Import only the language definitions used by the site.

  2. 02 / Highlight

    Tokenize synchronously with deterministic output.

  3. 03 / Decorate

    Add titles, line numbers, and exact line or range states.

  4. 04 / Theme

    Apply light and dark palettes to one semantic HTML tree.

Content pipeline

Every transformation stays visible.

A short pipeline is easier to reason about, easier to test, and easier to run identically during SSR and in the browser.

Built to compose

A clean fit for Markdown and existing pipelines.

Use the direct API with TanStack Markdown, or plug the same highlighter into remark and rehype. Adapters take an explicit highlighter so they never smuggle in every language.

Companion library
TanStackMarkdown
Explore Markdown
Open source ecosystem

Tiny infrastructure still deserves serious maintenance.

Maintainers

Avatar of Tanner Linsley
Tanner Linsley
View All Maintainers

Partners

Gold
CodeRabbit
Cloudflare
Netlify
Railway
Lovable
Silver
SerpApi
AG Grid
Clerk
OpenRouter
WorkOS
Bronze
Prisma
Sentry
Unkey
Electric
Highlight You?
We're looking for TanStack Highlight Partners to join our mission! Partner with us to push the boundaries of TanStack Highlight and build amazing things together.
Let's chat
View Previous Partners

GitHub Sponsors

Become a Sponsor
Wow, you've come a long way!
Only one thing left to do...
© 2026 TanStack LLC