New to Gradio? Start here: Getting Started

Building Demos

Interface

gradio.Interface(self, fn, inputs, outputs, ···)

The Interface class is a high-level abstraction that allows you to create a web-based demo around a machine learning model or arbitrary Python function by specifying: (1) the function (2) the desired input components and (3) desired output components.

ParameterDescription
fn

Callable

required

the function to wrap an interface around. Often a machine learning model's prediction function.

inputs

str | Component | List[str] | List[Component] | None

required

a single Gradio component, or list of Gradio components. Components can either be passed as instantiated objects, or referred to by their string shortcuts. The number of input components should match the number of parameters in fn. If set to None, then only the output components will be displayed.

outputs

str | Component | List[str] | List[Component] | None

required

a single Gradio component, or list of Gradio components. Components can either be passed as instantiated objects, or referred to by their string shortcuts. The number of output components should match the number of values returned by fn. If set to None, then only the input components will be displayed.

examples

List[List[Any]] | str | None

default: None

sample inputs for the function; if provided, appear below the UI components and can be clicked to populate the interface. Should be nested list, in which the outer list consists of samples and each inner list consists of an input corresponding to each input component. A string path to a directory of examples can also be provided. If there are multiple input components and a directory is provided, a log.csv file must be present in the directory to link corresponding inputs.

cache_examples

bool | None

default: None

If True, caches examples in the server for fast runtime in examples. The default option in HuggingFace Spaces is True. The default option elsewhere is False.

examples_per_page

int

default: 10

If examples are provided, how many to display per page.

live

bool

default: False

whether the interface should automatically rerun if any of the inputs change.

interpretation

Callable | str

default: None

function that provides interpretation explaining prediction output. Pass "default" to use simple built-in interpreter, "shap" to use a built-in shapley-based interpreter, or your own custom interpretation function.

num_shap

float

default: 2.0

a multiplier that determines how many examples are computed for shap-based interpretation. Increasing this value will increase shap runtime, but improve results. Only applies if interpretation is "shap".

title

str | None

default: None

a title for the interface; if provided, appears above the input and output components in large font.

description

str | None

default: None

a description for the interface; if provided, appears above the input and output components and beneath the title in regular font. Accepts Markdown and HTML content.

article

str | None

default: None

an expanded article explaining the interface; if provided, appears below the input and output components in regular font. Accepts Markdown and HTML content.

thumbnail

str | None

default: None

path or url to image to use as display image when the web demo is shared on social media.

theme

str | None

default: None

Theme to use - right now, only "default" is supported. Can be set with the GRADIO_THEME environment variable.

css

str | None

default: None

custom css or path to custom css file to use with interface.

allow_flagging

str | None

default: None

one of "never", "auto", or "manual". If "never" or "auto", users will not see a button to flag an input and output. If "manual", users will see a button to flag. If "auto", every prediction will be automatically flagged. If "manual", samples are flagged when the user clicks flag button. Can be set with environmental variable GRADIO_ALLOW_FLAGGING; otherwise defaults to "manual".

flagging_options

List[str] | None

default: None

if provided, allows user to select from the list of options when flagging. Only applies if allow_flagging is "manual".

flagging_dir

str

default: "flagged"

what to name the directory where flagged data is stored.

flagging_callback

FlaggingCallback

default:

An instance of a subclass of FlaggingCallback which will be called when a sample is flagged. By default logs to a local CSV file.

analytics_enabled

bool | None

default: None

Whether to allow basic telemetry. If None, will use GRADIO_ANALYTICS_ENABLED environment variable if defined, or default to True.

Example usage:

import gradio as gr

def image_classifier(inp):
    pass  # image classifier model defined here
gr.Interface(fn=image_classifier, inputs="image", outputs="label")
import gradio as gr

def speech_to_text(inp):
    pass  # speech recognition model defined here

gr.Interface(speech_to_text, inputs="mic", outputs=gr.Textbox(label="Predicted text", lines=4))

Methods:

launch()

gradio.Interface().launch(···)

Launches a simple web server that serves the demo. Can also be used to create a shareable link.

ParameterDescription
inline

bool | None

default: None

whether to display in the interface inline in an iframe. Defaults to True in python notebooks; False otherwise.

inbrowser

bool

default: False

whether to automatically launch the interface in a new tab on the default browser.

share

bool

default: False

whether to create a publicly shareable link for the interface. Creates an SSH tunnel to make your UI accessible from anywhere.

debug

bool

default: False

if True, blocks the main thread from running. If running in Google Colab, this is needed to print the errors in the cell output.

auth

Callable | Union[Tuple[str, str] | List[Tuple[str, str]]] | None

default: None

If provided, username and password (or list of username-password tuples) required to access interface. Can also provide function that takes username and password and returns True if valid login.

auth_message

str | None

default: None

If provided, HTML message provided on login page.

prevent_thread_lock

bool

default: None

If True, the interface will block the main thread while the server is running.

show_error

bool

default: False

If True, any errors in the interface will be printed in the browser console log

server_port

int | None

default: True

will start gradio app on this port (if available). Can be set by environment variable GRADIO_SERVER_PORT. If None, will search for an available port starting at 7860.

server_name

str | None

default: None

to make app accessible on local network, set this to "0.0.0.0". Can be set by environment variable GRADIO_SERVER_NAME. If None, will use "127.0.0.1".

show_tips

bool

default: None

if True, will occasionally show tips about new Gradio features

enable_queue

bool | None

default: False

if True, inference requests will be served through a queue instead of with parallel threads. Required for longer inference times (> 1min) to prevent timeout. The default option in HuggingFace Spaces is True. The default option elsewhere is False.

width

int

default: 500

The width in pixels of the iframe element containing the interface (used if inline=True)

height

int

default: 900

The height in pixels of the iframe element containing the interface (used if inline=True)

encrypt

bool

default: False

If True, flagged data will be encrypted by key provided by creator at launch

favicon_path

str | None

default: None

If a path to a file (.png, .gif, or .ico) is provided, it will be used as the favicon for the web page.

ssl_keyfile

str | None

default: None

If a path to a file is provided, will use this as the private key file to create a local server running on https.

ssl_certfile

str | None

default: None

If a path to a file is provided, will use this as the signed certificate for https. Needs to be provided if ssl_keyfile is provided.

ssl_keyfile_password

str | None

default: None

If a password is provided, will use this with the ssl certificate for https.

quiet

bool

default: False

If True, suppresses most print statements.

Example usage:

import gradio as gr

def image_classifier(inp):
    pass # image classifier model defined here

demo = gr.Interface(image_classifier, "image", "label")
demo.launch(share=True)

load()

gradio.Interface.load(name, ···)

Class method that constructs an Interface from a Hugging Face repo. Can accept model repos (if src is "models") or Space repos (if src is "spaces"). The input and output components are automatically loaded from the repo.

ParameterDescription
name

str

required

the name of the model (e.g. "gpt2"), can include the `src` as prefix (e.g. "models/gpt2")

src

str | None

default: None

the source of the model: `models` or `spaces` (or empty if source is provided as a prefix in `name`)

api_key

str | None

default: None

optional api key for use with Hugging Face Hub

alias

str | None

default: None

optional string used as the name of the loaded model instead of the default name

Example usage:

description = "Story generation with GPT"
examples = [["An adventurer is approached by a mysterious stranger in the tavern for a new quest."]]

demo = gr.Interface.load("models/EleutherAI/gpt-neo-1.3B", description=description, examples=examples)

demo.launch()

from_pipeline()

gradio.Interface.from_pipeline(pipeline)

Class method that constructs an Interface from a Hugging Face transformers.Pipeline object. The input and output components are automatically determined from the pipeline.

ParameterDescription
pipeline

transformers.Pipeline

required

the pipeline object to use.

Example usage:

import gradio as gr
from transformers import pipeline

pipe = pipeline("image-classification")

gr.Interface.from_pipeline(pipe).launch()

Combining Interfaces

Once you have created several Interfaces, we provide several classes that let you start combining them together. For example, you can chain them in Series or compare their outputs in Parallel if the inputs and outputs match accordingly. You can also display arbitrary Interfaces together in a tabbed layout using TabbedInterface.

Classes:

TabbedInterface

gradio.TabbedInterface(interface_list, ···)

A TabbedInterface is created by providing a list of Interfaces, each of which gets rendered in a separate tab.

ParameterDescription
interface_list

List[Interface]

required

a list of interfaces to be rendered in tabs.

tab_names

List[str] | None

default: None

a list of tab names. If None, the tab names will be "Tab 1", "Tab 2", etc.

Parallel

gradio.Parallel(*interfaces, ···)

Creates a new Interface consisting of multiple models in parallel (comparing their outputs). The Interfaces to put in Parallel must share the same input components (but can have different output components).

ParameterDescription
*interfaces

Interface

default: None

any number of Interface objects that are to be compared in parallel

**options

optional

default: None

additional kwargs that are passed into the new Interface object to customize it

Series

gradio.Series(*interfaces, ···)

Creates a new Interface from multiple models in series (the output of one is fed as the input to the next, and so the input and output components must agree between the interfaces).

ParameterDescription
*interfaces

Interface

default: None

any number of Interface objects that are to be connected in series

**options

optional

default: None

additional kwargs that are passed into the new Interface object to customize it

Blocks

with gradio.Blocks(theme, analytics_enabled, mode):
    ···

The Blocks class is a low-level API that allows you to create custom web applications entirely in Python. Compared to the Interface class, Blocks offers more flexibility and control over: (1) the layout of components (2) the events that trigger the execution of functions (3) data flows (e.g. inputs can trigger outputs, which can trigger the next level of outputs). Blocks also offers ways to group together related demos e.g. using tabs. The basic usage of Blocks is as follows: create a Blocks object, then use it as a context (with the "with" statement), and then define layouts, components, or events within the Blocks context. Finally, call the launch() method to launch the demo.

ParameterDescription
theme

str

default: "default"

which theme to use - right now, only "default" is supported.

analytics_enabled

bool | None

default: None

whether to allow basic telemetry. If None, will use GRADIO_ANALYTICS_ENABLED environment variable or default to True.

mode

str

default: "blocks"

a human-friendly name for the kind of Blocks interface being created.

Example usage:

import gradio as gr

def update(name):
    return f"Welcome to Gradio, {name}!"

demo = gr.Blocks()

with demo:
    gr.Markdown("Start typing below and then click **Run** to see the output.")
    with gr.Row():
        inp = gr.Textbox(placeholder="What is your name?")
        out = gr.Textbox()
    btn = gr.Button("Run")
    btn.click(fn=update, inputs=inp, outputs=out)

demo.launch()

Layout Classes:

Row

with gradio.Row():
    ···

Row is a layout element within Blocks that renders all children horizontally.

Column

with gradio.Column():
    ···

Column is a layout element within Blocks that renders all children vertically.

Tabs and TabItem

with gradio.Tabs():
    with gradio.TabItem("Tab 1"):
      ···
    with gradio.TabItem("Tab 2"):
      ···

Tabs is a layout element within Blocks that can contain multiple TabItem's. Each TabItem gets rendered as a individual tab. The TabItem's must be nested within the Tabs context.

Group

with gradio.Group():
    ···

Group is a layout element within Blocks which groups together children so that they do not have any padding or margin between them.

Box

with gradio.Box():
    ···

Box is a a layout element which places children in a box with rounded corners and some padding around them.

Components

Gradio includes pre-built components that can be used as inputs or outputs in your Interface or Blocks with a single line of code. Components include preprocessing steps that convert user data submitted through browser to something that be can used by a Python function, and postprocessing steps to convert values returned by a Python function into something that can be displayed in a browser.

Textbox

gradio.Textbox(self, ···)

Creates a textarea for user to enter string input or display string output.

Preprocessing: passes textarea value as a str into the function.

Postprocessing: expects a str returned from function and sets textarea value to it.

Supported events: change(), submit()

ParameterDescription
value

str

default text to provide in textarea.

lines

int

minimum number of line rows to provide in textarea.

max_lines

int

maximum number of line rows to provide in textarea.

placeholder

str

placeholder hint to provide behind textarea.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

String Shortcuts

ShortcutEquivalent

"text"

gr.Textbox(lines=1)

"textarea"

gr.Textbox(lines=7)

Step-by-step Guides

Number

gradio.Number(self, ···)

Creates a numeric field for user to enter numbers as input or display numeric output.

Preprocessing: passes field value as a float or int into the function, depending on `precision`.

Postprocessing: expects an int or float returned from the function and sets field value to it.

Supported events: change(), submit()

ParameterDescription
value

float

default value.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

precision

Optional[int]

Precision to round input/output to. If set to 0, will round to nearest integer and covert type to int. If None, no rounding happens.

Step-by-step Guides

No guides yet, contribute a guide about Number

Slider

gradio.Slider(self, ···)

Creates a slider that ranges from `minimum` to `maximum` with a step size of `step`.

Preprocessing: passes slider value as a float into the function.

Postprocessing: expects an int or float returned from function and sets slider value to it as long as it is within range.

Supported events: change()

ParameterDescription
minimum

float

minimum value for slider.

maximum

float

maximum value for slider.

value

float

default value.

step

float

increment between slider values.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

Checkbox

gradio.Checkbox(self, ···)

Creates a checkbox that can be set to `True` or `False`.

Preprocessing: passes the status of the checkbox as a bool into the function.

Postprocessing: expects a bool returned from the function and, if it is True, checks the checkbox.

Supported events: change()

ParameterDescription
value

bool

if True, checked by default.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Checkbox

CheckboxGroup

gradio.CheckboxGroup(self, choices, ···)

Creates a set of checkboxes of which a subset can be checked.

Preprocessing: passes the list of checked checkboxes as a List[str] or their indices as a List[int] into the function, depending on `type`.

Postprocessing: expects a List[str], each element of which becomes a checked checkbox.

Supported events: change()

ParameterDescription
choices

List[str]

required

list of options to select from.

value

List[str]

default selected list of options.

type

str

Type of value to be returned by component. "value" returns the list of strings of the choices selected, "index" returns the list of indicies of the choices selected.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about CheckboxGroup

Radio

gradio.Radio(self, choices, ···)

Creates a set of radio buttons of which only one can be selected.

Preprocessing: passes the value of the selected radio button as a str or its index as an int into the function, depending on `type`.

Postprocessing: expects a str corresponding to the value of the radio button to be selected.

Supported events: change()

ParameterDescription
choices

List[str]

required

list of options to select from.

value

str

the button selected by default. If None, no button is selected by default.

type

str

Type of value to be returned by component. "value" returns the string of the choice selected, "index" returns the index of the choice selected.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Radio

Image

gradio.Image(self, ···)

Creates an image component that can be used to upload/draw images (as an input) or display images (as an output).

Preprocessing: passes the uploaded image as a numpy.array, PIL.Image or str filepath depending on `type`.

Postprocessing: expects a numpy.array, PIL.Image or str filepath to an image and displays the image.

Supported events: change(), clear(), edit()

ParameterDescription
value

str

A path or URL for the default value that Image component is going to take.

shape

Tuple[int, int]

(width, height) shape to crop and resize image to; if None, matches input image size. Pass None for either width or height to only crop and resize the other.

image_mode

str

"RGB" if color, or "L" if black and white.

invert_colors

bool

whether to invert the image as a preprocessing step.

source

str

Source of image. "upload" creates a box where user can drop an image file, "webcam" allows user to take snapshot from their webcam, "canvas" defaults to a white image that can be edited and drawn upon with tools.

tool

str

Tools used for editing. "editor" allows a full screen editor, "select" provides a cropping and zoom tool.

type

str

The format the image is converted to before being passed into the prediction function. "numpy" converts the image to a numpy array with shape (width, height, 3) and values from 0 to 255, "pil" converts the image to a PIL image object, "file" produces a temporary file object whose path can be retrieved by file_obj.name, "filepath" passes a str path to a temporary file containing the image.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

streaming

bool

If True when used in a `live` interface, will automatically stream webcam feed. Only valid is source is 'webcam'.

String Shortcuts

ShortcutEquivalent

"webcam"

gr.Image(source='webcam')

"sketchpad"

gr.Image(image_mode='L', source='canvas', shape=(28, 28), invert_colors=True)

"pil"

gr.Image(type='pil')

Step-by-step Guides

Video

gradio.Video(self, ···)

Creates an video component that can be used to upload/record videos (as an input) or display videos (as an output).

Preprocessing: passes the uploaded video as a str filepath whose extension can be set by `format`.

Postprocessing: expects a str filepath to a video which is displayed.

Supported events: change(), clear(), play(), pause(), stop()

ParameterDescription
value

str

A path or URL for the default value that Video component is going to take.

format

str

Format of video format to be returned by component, such as 'avi' or 'mp4'. Use 'mp4' to ensure browser playability. If set to None, video will keep uploaded format.

source

str

Source of video. "upload" creates a box where user can drop an video file, "webcam" allows user to record a video from their webcam.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

String Shortcuts

ShortcutEquivalent

"playable_video"

gr.Video(format='mp4')

Step-by-step Guides

No guides yet, contribute a guide about Video

Audio

gradio.Audio(self, ···)

Creates an audio component that can be used to upload/record audio (as an input) or display audio (as an output).

Preprocessing: passes the uploaded audio as a Tuple(int, numpy.array) corresponding to (sample rate, data) or as a str filepath, depending on `type`

Postprocessing: expects a Tuple(int, numpy.array) corresponding to (sample rate, data) or as a str filepath to an audio file, which gets displayed

Supported events: change(), clear(), play(), pause(), stop()

ParameterDescription
value

str

A path or URL for the default value that Audio component is going to take.

source

str

Source of audio. "upload" creates a box where user can drop an audio file, "microphone" creates a microphone input.

type

str

The format the audio file is converted to before being passed into the prediction function. "numpy" converts the audio to a tuple consisting of: (int sample rate, numpy.array for the data), "filepath" passes a str path to a temporary file containing the audio.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

streaming

bool

If set to true when used in a `live` interface, will automatically stream webcam feed. Only valid is source is 'microphone'.

String Shortcuts

ShortcutEquivalent

"microphone"

gr.Audio(source='microphone')

"mic"

gr.Audio(source='microphone')

Step-by-step Guides

File

gradio.File(self, ···)

Creates a file component that allows uploading generic file (when used as an input) and or displaying generic files (output).

Preprocessing: passes the uploaded file as a file-object or List[file-object] depending on `file_count` (or a bytes/Listbytes depending on `type`)

Postprocessing: expects a str path to a file returned by the function.

Supported events: change(), clear()

ParameterDescription
value

str

Default value given as file path

file_count

str

if single, allows user to upload one file. If "multiple", user uploads multiple files. If "directory", user uploads all files in selected directory. Return type will be list for each file in case of "multiple" or "directory".

type

str

Type of value to be returned by component. "file" returns a temporary file object whose path can be retrieved by file_obj.name, "binary" returns an bytes object.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

String Shortcuts

ShortcutEquivalent

"files"

gr.File(file_count='multiple')

Step-by-step Guides

No guides yet, contribute a guide about File

Dataframe

gradio.Dataframe(self, ···)

Accepts or displays 2D input through a spreadsheet-like component for dataframes.

Preprocessing: passes the uploaded spreadsheet data as a pandas.DataFrame, numpy.array, List[List], or List depending on `type`

Postprocessing: expects a pandas.DataFrame, numpy.array, List[List], or List which is rendered in the spreadsheet.

Supported events: change()

ParameterDescription
value

List[List[Any]]

Default value as a 2-dimensional list of values.

headers

List[str] | None

List of str header names. If None, no headers are shown.

row_count

int | Tuple[int, str]

Limit number of rows for input and decide whether user can create new rows. The first element of the tuple is an `int`, the row count; the second should be 'fixed' or 'dynamic', the new row behaviour. If an `int` is passed the rows default to 'dynamic'

col_count

int | Tuple[int, str]

Limit number of columns for input and decide whether user can create new columns. The first element of the tuple is an `int`, the number of columns; the second should be 'fixed' or 'dynamic', the new column behaviour. If an `int` is passed the columns default to 'dynamic'

datatype

str | List[str]

Datatype of values in sheet. Can be provided per column as a list of strings, or for the entire sheet as a single string. Valid datatypes are "str", "number", "bool", and "date".

type

str

Type of value to be returned by component. "pandas" for pandas dataframe, "numpy" for numpy array, or "array" for a Python array.

label

str

component name in interface.

max_rows

int

Maximum number of rows to display at once. Set to None for infinite.

max_cols

int

Maximum number of columns to display at once. Set to None for infinite.

overflow_row_behaviour

str

If set to "paginate", will create pages for overflow rows. If set to "show_ends", will show initial and final rows and truncate middle rows.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

String Shortcuts

ShortcutEquivalent

"numpy"

gr.Dataframe(type='numpy')

"matrix"

gr.Dataframe(type='array')

"array"

gr.Dataframe(type='array', col_count=1)

Step-by-step Guides

No guides yet, contribute a guide about Dataframe

Timeseries

gradio.Timeseries(self, ···)

Creates a component that can be used to upload/preview timeseries csv files or display a dataframe consisting of a time series graphically.

Preprocessing: passes the uploaded timeseries data as a pandas.DataFrame into the function

Postprocessing: expects a pandas.DataFrame to be returned, which is then displayed as a timeseries graph

Supported events: change()

ParameterDescription
value

str

File path for the timeseries csv file.

x

str

Column name of x (time) series. None if csv has no headers, in which case first column is x series.

y

str | List[str]

Column name of y series, or list of column names if multiple series. None if csv has no headers, in which case every column after first is a y series.

label

str

component name in interface.

colors

List[str]

an ordered list of colors to use for each line plot

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Timeseries

Label

gradio.Label(self, ···)

Displays a classification label, along with confidence scores of top categories, if provided.

Preprocessing: this component does *not* accept input.

Postprocessing: expects a Dict[str, float] of classes and confidences, or str with just the class or an int/float for regression outputs.

Supported events: change()

ParameterDescription
value

str

Default value to show

num_top_classes

int

number of most confident classes to show.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

HighlightedText

gradio.HighlightedText(self, ···)

Displays text that contains spans that are highlighted by category or numerical value.

Preprocessing: this component does *not* accept input.

Postprocessing: expects a List[Tuple[str, float | str]]] consisting of spans of text and their associated labels.

Supported events: change()

ParameterDescription
value

str

Default value

color_map

Dict[str, str]

Map between category and respective colors

show_legend

bool

whether to show span categories in a separate legend or inline.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about HighlightedText

JSON

gradio.JSON(self, ···)

Used to display arbitrary JSON output prettily.

Preprocessing: this component does *not* accept input.

Postprocessing: expects a valid JSON str -- or a list or dict that is JSON serializable.

Supported events: change()

ParameterDescription
value

str

Default value

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about JSON

HTML

gradio.HTML(self, ···)

Used to display arbitrary HTML output.

Preprocessing: this component does *not* accept input.

Postprocessing: expects a valid HTML str.

Supported events: change()

ParameterDescription
value

str

Default value

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about HTML

Chatbot

gradio.Chatbot(self, ···)

Displays a chatbot output showing both user submitted messages and responses

Preprocessing: this component does *not* accept input.

Postprocessing: expects a List[Tuple[str, str]], a list of tuples with user inputs and responses.

Supported events: change()

ParameterDescription
value

str

Default value

color_map

Tuple[str, str]

Chat bubble color of input text and output text respectively.

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Chatbot

Model3D

gradio.Model3D(self, ···)

Component creates a 3D Model component with input and output capabilities.

Supported events: change(), clear(), edit()

ParameterDescription
value

str

Default file to show

clear_color

List[r, g, b, a]

background color of scene

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Model3D

Plot

gradio.Plot(self, ···)

Used to display various kinds of plots (matplotlib, plotly, or bokeh are supported)

Preprocessing: this component does *not* accept input.

Postprocessing: expects either a matplotlib.pyplot.Figure, a plotly.graph_objects._figure.Figure, or a dict corresponding to a bokeh plot (json_item format)

Supported events: change(), clear()

ParameterDescription
value

matplotlib.pyplot.Figure | plotly.graph_objects._figure.Figure | dict

default plot to show

label

Optional[str]

component name in interface.

show_label

bool

if True, will display label.

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Plot

Markdown

gradio.Markdown(self, ···)

Used to render arbitrary Markdown output.

Preprocessing: this component does *not* accept input.

Postprocessing: expects a valid str that can be rendered as Markdown.

Supported events: change()

ParameterDescription
value

str

Default value

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Markdown

Button

gradio.Button(self, ···)

Used to create a button, that can be assigned arbitrary click() events. Accepts neither input nor output.

Supported events: click()

ParameterDescription
value

str

Default value

variant

str

'primary' for main call-to-action, 'secondary' for a more subdued style

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Button

Dataset

gradio.Dataset(self, components, samples, ···)

Used to create a output widget for showing datasets. Used to render the examples

Supported events: click()

ParameterDescription
components

List[Component]

required

Which component types to show in this dataset widget

samples

str

required

a nested list of samples. Each sublist within the outer list represents a data sample, and each element within the sublist represents an value for each component

type

str

'values' if clicking on a should pass the value of the sample, or "index" if it should pass the index of the sample

visible

bool

If False, component will be hidden.

Step-by-step Guides

No guides yet, contribute a guide about Dataset

Variable

gradio.Variable(self, ···)

Special hidden component that stores session state across runs of the demo by the

Preprocessing: No preprocessing is performed

Postprocessing: No postprocessing is performed

Supported events:

ParameterDescription
value

Any

the initial value of the state.

Step-by-step Guides

No guides yet, contribute a guide about Variable