GitPedia

Mkdocs marimo

mkdocs plugin for reactive and interactive docs with marimo

From marimo-team·Updated June 20, 2026·View on GitHub·

> [!WARNING] > The MkDocs marimo plugin is under active development. Features and documentation are being continuously updated and expanded. The project is written primarily in Python, distributed under the Apache License 2.0 license, first published in 2024. Key topics include: marimo, mkdocs, mkdocs-plugin.

Latest release: 0.2.1
March 18, 2025View Changelog →

MkDocs marimo Plugin

[!WARNING]
The MkDocs marimo plugin is under active development. Features and documentation are being continuously updated and expanded.

This plugin allows you to embed interactive marimo notebooks in your MkDocs documentation.

Installation

bash
# pip pip install mkdocs-marimo # uv uv pip install mkdocs-marimo # pixi pixi add mkdocs-marimo

Usage

Create reactive and interactive Python blocks in your markdown files using marimo.

Embedding inline Python code and marimo elements

This uses code fences to embed marimo components as marimo islands.

markdown
```python {marimo} import marimo as mo name = mo.ui.text(placeholder="Enter your name") name ``` ```python {marimo} mo.md(f"Hello, **{name.value or '__'}**!") ```

Embedding the marimo playground

For an easy way to embed marimo notebooks or applications, we recommend embedding the marimo playground. This feature uses pymdownx.blocks to embed marimo notebooks in your MkDocs documentation, creating iframes that render the marimo playground.

markdown
/// marimo-embed height: 400px mode: run ```python @app.cell def __(): import matplotlib.pyplot as plt import numpy as np x = np.linspace(0, 10, 100) y = np.sin(x) plt.figure(figsize=(8, 4)) plt.plot(x, y) plt.title('Sine Wave') plt.xlabel('x') plt.ylabel('sin(x)') plt.grid(True) plt.gca() return ``` ///

Available options for marimo-embed:

  • height: Named sizes (small, medium, large, xlarge, xxlarge) or custom pixel values (e.g. 500px) (default: medium)
  • mode: read, edit (default: read)
  • app_width: medium, full, compact (default: medium)

You can also embed marimo files directly:

markdown
/// marimo-embed-file filepath: path/to/your/file.py height: 400px mode: read show_source: true ///

Additional options for marimo-embed-file:

  • filepath: path to the marimo file to embed (required)
  • show_source: true, false (default: true) - whether to show the source code below the embed

Examples

Checkout the documentation for more examples.

Contributions welcome

Feel free to ask questions, enhancements and to contribute to this project!

See CONTRIBUTING.md for more details.

Credits

Contributors

Showing top 8 contributors by commit count.

View all contributors on GitHub →

This article is auto-generated from marimo-team/mkdocs-marimo via the GitHub API.Last fetched: 6/28/2026