Skip to content

Latest commit

聽

History

265 Commits

Folders and files

NameName
Last commit message
Last commit date
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽
聽

marimo-studio

Four example notebooks, each heading a column of its four views

CI PyPI Python 3.10 through 3.14

Turn your marimo notebook into any document. Use your marimo notebook's outputs as building blocks. Place a chart, a table, or a single number in a web page, a slide deck, or a paper, and keep all of your Python in the notebook.

Each document is a view: an ordinary project in its own folder beside the notebook, which you or a coding agent can edit with any tool. A view places a whole cell with its controls, one output such as a figure, or a value that you format yourself. Pages stay live, so changing a control updates every result that reads it, and PDFs compile again with the new values. Every result traces back to the notebook cell that computed it.

You can start from HTML, React, Svelte, Reveal.js, Observable Notebook Kit, Quarto, Typst, or LaTeX, and bring any other framework, template, or build tool with a view provider, a Python package.

Note

Studio is experimental and changing rapidly. Pin marimo-studio and third-party view providers in saved projects.

Outputs as building blocks

Two cells from a notebook that solves an optimization problem:

@app.cell
def solution(q, solve):
    solution = solve(q)
    return (solution,)


@app.cell
def level_curves(bowl, draw_problem, region, solution):
    problem_figure = draw_problem(region, bowl, solution)
    problem_figure
    return (problem_figure,)

An HTML page places the figure and the optimal value:

<marimo-output value="problem_figure"></marimo-output>
<p>The optimal value is <strong mo-value="solution.value"></strong>.</p>

A Typst report places the same two results in a PDF:

#import "marimo.typ": marimo_output, marimo_value

#marimo_output("problem_figure", width: 100%)
The optimal value is #marimo_value("solution.value", default: 0).

The notebook computes both results, and each view places them in its own format:

The solution and level_curves cells in marimo, with the level-curve figure under level_curves, beside the HTML page and the Typst PDF. The page and the PDF show the same figure and state the optimal value.

The page shows the figure as marimo renders it. The PDF draws it as a vector graphic at the width the Typst source places it.

What is Studio? explains the model, How Studio works shows how a page receives your notebook's results, and the Quadratic programs example shows both views next to the notebook.

Get started

Paste this request into Claude Code, Codex, or another terminal agent:

Run `uvx --with marimo-studio agent-plugins read marimo-studio` and create
a scrollytelling report and a slide deck explaining calculus basics.

The agent reads the instructions Studio ships for coding agents, starts a notebook with Studio, writes the calculus in Python cells, then builds both views and shows them beside the notebook. uv supplies uvx.

To work by hand, open a notebook with Studio:

uvx --with marimo-studio marimo edit analysis.py --sandbox --watch

Click Add view in the toolbar, choose HTML document, and create the view. Notebook and Preview open side by side. Edit the view's files in Studio's Source pane or in your own editor, and Preview rebuilds when you save.

Notebook, Preview, and view source in Studio

Getting started walks through a first view, Author with a coding agent covers working with an agent, and Select results with Lens points the agent at any part of a view, down to a figure inside a PDF.

Examples

Each example notebook backs four views:

  • Quadratic programs: a Reveal.js lecture, an HTML explainer, a Svelte and D3 lab, and a Typst report.
  • Rio 2016 athletes: an HTML overview, a Mosaic explorer, a Three.js presentation, and a Quarto paper.
  • Earthquake watch: an Observable Plot story, a MapLibre operations map, a Reveal.js briefing, and a Quarto bulletin.
  • Building occupancy: a Notebook Kit monitor, a PDF field report, a LaTeX journal paper, and a Recharts model review.

D3, Mosaic, Three.js, MapLibre, Observable Plot, and Recharts run in the views' own code and draw the values those views read from the notebook. A page can load any JavaScript library the same way.

Run or export a view

Serve the notebook's views as a live Python app:

uvx --with marimo-studio marimo run analysis.py --sandbox

Or export the report view as a static site:

uvx marimo-studio view export report --target analysis.py --output dist/report

The export runs the notebook on your machine, saves the results for each state the view prepares, and leaves the notebook source out of the site. Views can also run Python in your reader's browser. Run or export a view compares the options.

Documentation

Guide 路 Examples 路 Reference 路 Troubleshooting 路 Security 路 Contributing

License

Apache License 2.0.

Releases

Packages

Contributors

Languages