# Gradio 3.0 is Out!

huggingface.co · Abubakar Abid · May 16, 2022

**Type:** Announcement

## Summary

Gradio 3.0 introduces a ground-up redesign of the Gradio library to improve machine learning demo development and browser performance. The frontend has been rebuilt using modern technologies such as Svelte, resulting in smaller payloads, faster page load times, and cleaner visual designs suitable for embedding in blog posts. Component updates include revamping the Dataframe component to support CSV drag-and-drop, introducing new UI elements like Gallery, and adding the TabbedInterface class to group demos under distinct tabs. Developers also gain access to Gradio Blocks, a low-level Python API enabling custom layouts, multi-step interfaces, dynamic component property modifications, and complex data flows. A competition called the Gradio Blocks Party has been organized through the end of May to encourage community adoption.

## Context

Machine learning demos allow users to test models, provide prediction feedback, and build trust in model performance. More than 600,000 demos have been built with Gradio since 2019, leading to user demand for faster load times, cleaner embeddable designs, greater layout control, and flexible data flows beyond simple input-output pairs.

## Approach / What changed

Gradio 3.0 rebuilt its frontend using Svelte, overhauled components like Dataframe, added the Gallery component, and introduced the TabbedInterface class. It also launched Gradio Blocks, a low-level Python API that gives developers fine-grained control over layout structure, multi-step execution flows, and dynamic UI component properties.

## Takeaways

- Rebuilding the Gradio frontend with Svelte reduced payload sizes and accelerated page load speeds.
- The low-level Gradio Blocks API allows developers to configure custom layouts, multi-step model pipelines, and dynamic component properties directly in Python.
- Component updates include CSV drag-and-drop support for Dataframe, a new Gallery UI component, and the TabbedInterface class for grouping demos.

**Tags:** [Developer Experience](https://yomu.fyi/topic/developer-experience), [Machine Learning](https://yomu.fyi/topic/machine-learning), [Open Source](https://yomu.fyi/topic/open-source), [Performance](https://yomu.fyi/topic/performance), [Python](https://yomu.fyi/topic/python)

[Read original post](https://huggingface.co/blog/gradio-blocks)
