Skip to main content
The ClearButton clears the values of specified components when clicked.

​
Basic usage

import gradio as gr

with gr.Blocks() as demo:
    text = gr.Textbox(label="Input")
    output = gr.Textbox(label="Output")
    clear = gr.ClearButton([text, output])
    
demo.launch()

​
Constructor

​
components
Component | Sequence[Component] | None
default:"None"
Component(s) to clear when button is clicked
​
value
str
default:"'Clear'"
Button label text
​
variant
Literal['primary', 'secondary', 'stop']
default:"'secondary'"
Button style variant
​
size
Literal['sm', 'md', 'lg']
default:"'lg'"
Button size

​
Methods

​
add

Add components to be cleared: 
clear_btn = gr.ClearButton()
clear_btn.add([component1, component2])

​
Example

import gradio as gr

def process(text, num):
    return f"{text} - {num}"

with gr.Blocks() as demo:
    with gr.Row():
        text_input = gr.Textbox(label="Text")
        num_input = gr.Number(label="Number")
    
    output = gr.Textbox(label="Result")
    
    with gr.Row():
        submit = gr.Button("Submit")
        clear = gr.ClearButton([text_input, num_input, output])
    
    submit.click(fn=process, inputs=[text_input, num_input], outputs=output)
    
demo.launch()