Gradio gr.HTML release: one-shot web apps in a single file

Gradio released gr.HTML today, a new component that lets developers wrap a local HTML file or raw HTML string into a runnable Gradio app with a single call. The component runs the HTML inside a Gradio interface so the file can be served, previewed locally, or packaged for Hugging Face Spaces without modifying the Python server code.

gr.HTML accepts a filesystem path, a URL, or an HTML string, and presents that content as an embeddable frame inside a Gradio Blocks layout. The workflow is intentionally compact: point gr.HTML at an existing index.html and call launch to serve the frontend alongside any Python callbacks. Gradio documents include examples for embedding JavaScript widgets, single-page apps, and micro-frontends that communicate with Python via Gradio events or standard web messaging.

Example usage is concise and reflects the one-shot intent:

import gradio as gr

with gr.Blocks() as demo:
 html = gr.HTML("path/to/index.html")

demo.launch()

This pattern preserves an existing client-side codebase while exposing it through the same port and runtime Gradio uses for typical Python components. Developers can also provide HTML as a string to generate inline content or point gr.HTML at a remote URL to embed third-party pages inside an interface.

How gr.HTML works

gr.HTML embeds the supplied HTML into a Gradio layout and serves it from the same development server that hosts other Gradio components. The component creates an iframe or a DOM insertion depending on the content and context, and Gradio's runtime maps static assets so relative paths in the HTML continue to load when served. For local development the component supports hot reload in many cases, so editing the source HTML file updates the running preview without reconstructing the entire Python environment.

Integration points include JavaScript events and message passing. A developer can build a client-side UI that dispatches a message to Python code via Gradio's event handlers or use HTTP endpoints to communicate between the embedded frontend and backend. The approach lowers friction for teams that already have a frontend artifact and want to expose it quickly to Python-driven logic, model demos, or interactive visualizations.

Deployment and limits

gr.HTML is designed to work with local launches and with hosted deployments on Hugging Face Spaces. When used in Spaces, the HTML file and its assets become part of the repository served by the environment. The component does not alter how Spaces handles build steps or static asset bundling, so developers should include necessary build outputs in the repository or use a build script to produce the final HTML before deployment.

There are practical constraints. Embedding complex single-page applications that expect a full application server may require additional routing or build adjustments. Cross-origin restrictions will still apply when embedding remote URLs, and some browser security features can limit interaction between the embedded content and the Gradio runtime. Developers should test expected messaging and resource loading in both local and deployed environments.

Why it matters

gr.HTML reduces the friction of publishing interactive frontends with Python backends by letting developers reuse existing HTML artifacts without rebuilding them as separate Gradio components. The feature shortens the path from a static web bundle to a runnable demo or model interface, affecting researchers, data scientists, and teams that maintain separate frontend and Python stacks.