@jupyter-kit

Render Jupyter notebooks — and optionally run Python / R in the browser, or connect to a remote Jupyter kernel — from any framework.

Get started What's new in v3 View on GitHub

Features

Framework-agnostic core

Core has zero framework dependencies. First-class wrappers for React, Vue, Svelte, and plain Web Components — pick one or use the core directly from vanilla JS.

Read-only by default

The baseline install is a pure notebook viewer — markdown, code with syntax highlighting, images, tables, and Jupyter-style outputs. Perfect for docs sites and blogs.

Opt-in inline editing

Drop in @jupyter-kit/editor-codemirror to get editable cells, a per-cell toolbar, and Shift+Enter to run. Nothing to configure.

Run Python in-browser

@jupyter-kit/executor-pyodide runs cells inside a dedicated Web Worker via Pyodide. No server, no round-trip — your code never leaves the browser.

Run R + plots in-browser

@jupyter-kit/executor-webr wraps WebR and captures R graphics as PNG. Same privacy posture as Python — execution happens entirely on the client.

…or connect to a remote kernel

@jupyter-kit/executor-jupyter speaks the Jupyter kernel WebSocket protocol — point it at a Jupyter Server and cells run on any installed kernel (Python, R, Julia, …). Good for full-fat scientific stacks.

Math: bundled or from CDN

Pick KaTeX or MathJax, and bundle the engine or pull it from a CDN. CDN plugins add ~2 KB; bundled give you offline-safe math.

13 chrome + 8 syntax themes

Swap the look without touching JS — published as independent @jupyter-kit/theme-<name> packages, or grab @jupyter-kit/theme-all.

Lezer syntax highlighting

Fast, tree-based highlighting for Python, JS, R, Julia, Haskell, and Ruby. No Prism, no highlight.js — just the Lezer parsers you actually use.

Small, tree-shakable

Every package is opt-in. Want a read-only viewer with math? Skip editor/executors. Want Python execution? Skip WebR. Baseline install stays tiny.

Try it now

Theme switcher Swap chrome, syntax, and math engine at runtime.

Run Python in-browser Edit and execute a live Python notebook.

Run R + plots in-browser Plot a normal density inline, right here.

Install the minimum you need

# Just view notebooks (React):
pnpm add @jupyter-kit/react @jupyter-kit/theme-default

# Or with Vue / Svelte / Web Components:
pnpm add @jupyter-kit/vue    @jupyter-kit/theme-default
pnpm add @jupyter-kit/svelte @jupyter-kit/theme-default
pnpm add @jupyter-kit/wc     @jupyter-kit/theme-default

The core is pulled in transitively — you only ever install the wrapper you actually use.

See the install wizard for case-by-case guidance on editing, math, Pyodide, WebR, and remote Jupyter kernels.