Gradio Svelte

Yes, Gradio is Svelte!

Gradio is a Python library for building ML UIs, but its frontend interface is powered by Svelte components.

The Backend

You write Python code to define the logic. Gradio wraps this logic into an API.

                    import gradio as gr
                

The Frontend

Gradio uses Svelte to render the UI components (Buttons, Textboxes, Plots). It handles the state management and reactivity efficiently.

                    gr.Button("Click Me") → <Button.svelte>
                

How they connect

Python (Logic) Svelte (UI)

import gradio as gr

def greet(name):
    return "Hello " + name + "! from Python."

with gr.Blocks() as demo:
    inp = gr.Textbox(label="Name")
    btn = gr.Button("Greet")
    out = gr.Textbox(label="Output")
    
    btn.click(greet, inp, out)

demo.launch()






{output}

Click the tabs above to see how Gradio translates Python definitions into Svelte logic.

Python Backend

Logic & API

Gradio Bridge

WebSockets / REST

Svelte Frontend

UI Rendering

Live Simulation

This interface is styled to look like Gradio, demonstrating the Svelte-like reactivity.

Input Textbox Output

Waiting for input...