Insert containers separated into tabs.

Inserts a number of multi-element containers as tabs. Tabs are a navigational element that allows users to easily move between groups of related content.

To add elements to the returned containers, you can use the with notation (preferred) or just call methods directly on the returned object. See examples below.

Note

All content within every tab is computed and sent to the frontend, regardless of which tab is selected. Tabs do not currently support conditional rendering. If you have a slow-loading tab, consider using a widget like st.segmented_control to conditionally render content instead.

Function signature[source]

st.tabs(tabs, *, width="stretch")

Parameters

tabs (list of str)

Creates a tab for each string in the list. The first tab is selected by default. The string is used as the name of the tab and can optionally contain GitHub-flavored Markdown of the following types: Bold, Italics, Strikethroughs, Inline Code, Links, and Images. Images display like icons, with a max height equal to the font height.

Unsupported Markdown elements are unwrapped so only their children (text contents) render. Display unsupported elements as literal characters by backslash-escaping them. E.g., "1\. Not an ordered list".

See the body parameter of st.markdown for additional, supported Markdown directives.

width ("stretch" or int)

The width of the tab container. This can be one of the following:

  • "stretch" (default): The width of the container matches the width of the parent container.
  • An integer specifying the width in pixels: The container has a fixed width. If the specified width is greater than the width of the parent container, the width of the container matches the width of the parent container.
Returns

(list of containers)

A list of container objects.

Examples

You can use the with notation to insert any element into a tab:

import streamlit as st

tab1, tab2, tab3 = st.tabs(["Cat", "Dog", "Owl"])

with tab1:
    st.header("A cat")
    st.image("https://static.streamlit.io/examples/cat.jpg", width=200)
with tab2:
    st.header("A dog")
    st.image("https://static.streamlit.io/examples/dog.jpg", width=200)
with tab3:
    st.header("An owl")
    st.image("https://static.streamlit.io/examples/owl.jpg", width=200)

Or you can just call methods directly on the returned objects:

import streamlit as st
import numpy as np

tab1, tab2 = st.tabs(["πŸ“ˆ Chart", "πŸ—ƒ Data"])
data = np.random.randn(10, 1)

tab1.subheader("A tab with a chart")
tab1.line_chart(data)

tab2.subheader("A tab with the data")
tab2.write(data)
forum

Still have questions?

Our forums are full of helpful information and Streamlit experts.