1. Building Demos
  2. TabbedInterface

New to Gradio? Start here: Getting Started

See the Release History

TabbedInterface

gradio.TabbedInterface(interface_list, ···)

Description

A TabbedInterface is created by providing a list of Interfaces or Blocks, each of which gets rendered in a separate tab. Only the components from the Interface/Blocks will be rendered in the tab. Certain high-level attributes of the Blocks (e.g. custom css, js, and head attributes) will not be loaded.

Initialization

Parameters
🔗
interface_list: list[Blocks]

A list of Interfaces (or Blocks) to be rendered in the 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.

🔗
title: str | None
default = None

The tab title to display when this demo is opened in a browser window.

🔗
theme: Theme | str | None
default = None

A Theme object or a string representing a theme. If a string, will look for a built-in theme with that name (e.g. "soft" or "default"), or will attempt to load a theme from the Hugging Face Hub (e.g. "gradio/monochrome"). If None, will use the Default theme.

🔗
analytics_enabled: bool | None
default = None

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

🔗
css: str | None
default = None

Custom css as a string or path to a css file. This css will be included in the demo webpage.

🔗
js: str | None
default = None

Custom js as a string or path to a js file. The custom js should in the form of a single js function. This function will automatically be executed when the page loads. For more flexibility, use the head parameter to insert js inside <script> tags.

🔗
head: str | None
default = None

Custom html to insert into the head of the demo webpage. This can be used to add custom meta tags, multiple scripts, stylesheets, etc. to the page.

Demos