Build Gradio apps into Quarto pages

quarto-gradio runs embedded Python Gradio apps in the reader’s browser from static HTML documents.

quarto-gradio is a Quarto extension for publishing Python Gradio apps inside HTML pages and Reveal.js presentations. A reader opens the published page, the browser starts Python through Pyodide, and the app becomes interactive without a Python application server.

Code

import gradio as gr

def greet(name):
    return f"Hello {name}!"

demo = gr.Interface(
    fn=greet,
    inputs="textbox",
    outputs="textbox",
    live=True,
    flagging_mode="never",
)

demo.launch()

import gradio as gr def greet(name): return f"Hello {name}!" demo = gr.Interface( fn=greet, inputs="textbox", outputs="textbox", live=True, flagging_mode="never", ) demo.launch()

Type a name above to see the app respond. The source that creates this app is the same source shown in the Quickstart.

The Gradio team archived Gradio Lite on September 11, 2025. quarto-gradio pins its browser runtime to the final @gradio/lite release, 5.45.0. The runtime receives no upstream fixes. Use trusted app code and pinned Python packages.

What happens when a page opens

flowchart TD
  build["Build time<br/>Quarto source to filter to HTML"]
  browser["Browser time<br/>Gradio Lite to Pyodide to app"]
  build -->|reader opens page| browser

quarto-gradio renders app source into HTML, then starts the app in the reader’s browser.

Quarto renders the source document. The browser later downloads the runtime, installs app requirements, executes the Python source in a worker, and mounts the interface. This split lets the generated files deploy to static hosting. It also means first startup needs network access and the Python source must not contain secrets.

Read How it Works for the complete model or Runtime and Trust for version, network, and security boundaries.

Choose a path

Goal	Start here
Render a first app	Quickstart
Let readers edit the Python source	Build a Coding Playground
Use Plotly, Faker, or another package	Install Python Packages
Put several apps in one document	Define Multiple Apps
Author from a notebook	Use a Jupyter Notebook
Present an app on slides	Use Reveal.js
Find a working variation	Example Gallery
Look up an option	Configuration Reference
Diagnose a failure	Troubleshooting