CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/pypi-streamlit

The fastest way to build and share data apps

Overview
Eval results
Files

display-elements.mddocs/

Display Elements and Text

Core functions for displaying text, data, and status messages. These elements form the foundation of Streamlit's content display capabilities, providing everything from basic text formatting to sophisticated data visualization.

Capabilities

Text and Headers

Display formatted text content with various emphasis levels and styling options.

def title(body: str, anchor: str = None) -> DeltaGenerator:
    """
    Display text in title formatting as the largest header.
    
    Parameters:
    - body: The text to display as title
    - anchor: Optional anchor name for the title
    """

def header(body: str, anchor: str = None) -> DeltaGenerator:
    """
    Display text in header formatting (H1 level).
    
    Parameters:
    - body: The text to display as header  
    - anchor: Optional anchor name for the header
    """

def subheader(body: str, anchor: str = None) -> DeltaGenerator:
    """
    Display text in subheader formatting (H2 level).
    
    Parameters:
    - body: The text to display as subheader
    - anchor: Optional anchor name for the subheader
    """

def text(body: str) -> DeltaGenerator:
    """
    Display plain text.
    
    Parameters:
    - body: The text to display
    """

def caption(body: str, unsafe_allow_html: bool = False) -> DeltaGenerator:
    """
    Display text in small, muted formatting for captions.
    
    Parameters:
    - body: The text to display as caption
    - unsafe_allow_html: Whether to allow HTML tags (use with caution)
    """

Usage Example

import streamlit as st

st.title("My Application")
st.header("Data Analysis")
st.subheader("Results Summary")
st.text("This is regular text content.")
st.caption("This is a caption with smaller, muted text.")

Markdown and Code

Display rich formatted content including Markdown, LaTeX, and syntax-highlighted code.

def markdown(body: str, unsafe_allow_html: bool = False) -> DeltaGenerator:
    """
    Display Markdown-formatted text.
    
    Parameters:
    - body: The Markdown text to display
    - unsafe_allow_html: Whether to allow HTML tags (use with caution)
    """

def latex(body: str) -> DeltaGenerator:
    """
    Display LaTeX-formatted mathematical expressions.
    
    Parameters:
    - body: The LaTeX expression to render
    """

def code(body: str, language: str = "python") -> DeltaGenerator:
    """
    Display code with syntax highlighting.
    
    Parameters:
    - body: The code string to display
    - language: Programming language for syntax highlighting
    """

Usage Example

import streamlit as st

# Markdown content
st.markdown("""
## My Report
This is **bold** and this is *italic*.
""")

# LaTeX expression
st.latex(r"\sum_{i=1}^{n} x_i^2")

# Code with syntax highlighting
st.code("""
def hello_world():
    print("Hello, Streamlit!")
""", language="python")

Data Display

Present structured data in tables and interactive dataframes.

def dataframe(data, width: int = None, height: int = None, use_container_width: bool = False) -> DeltaGenerator:
    """
    Display an interactive dataframe.
    
    Parameters:
    - data: pandas.DataFrame, dict, list, or array-like data
    - width: Width in pixels (None for auto-sizing)
    - height: Height in pixels (None for auto-sizing)
    - use_container_width: Whether to use full container width
    """

def table(data) -> DeltaGenerator:
    """
    Display a static table.
    
    Parameters:
    - data: pandas.DataFrame, dict, list, or array-like data
    """

def json(body) -> DeltaGenerator:
    """
    Display JSON data in an expandable tree format.
    
    Parameters:
    - body: JSON-serializable object to display
    """

Usage Example

import streamlit as st
import pandas as pd

# Sample data
data = pd.DataFrame({
    'Name': ['Alice', 'Bob', 'Charlie'],
    'Age': [25, 30, 35],
    'City': ['New York', 'London', 'Tokyo']
})

# Interactive dataframe
st.dataframe(data)

# Static table
st.table(data)

# JSON display
st.json({
    "users": ["alice", "bob"],
    "settings": {"theme": "dark", "notifications": True}
})

Metrics and Key Values

Display key performance indicators and metrics with optional delta indicators.

def metric(label: str, value, delta=None, delta_color: str = "normal") -> DeltaGenerator:
    """
    Display a metric with an optional delta indicator.
    
    Parameters:
    - label: The metric label/name
    - value: The current metric value
    - delta: Optional change indicator (number or string)
    - delta_color: Color for delta ("normal", "inverse", or "off")
    """

Usage Example

import streamlit as st

# Metrics with deltas
col1, col2, col3 = st.columns(3)

with col1:
    st.metric("Revenue", "$1.2M", "+12.5%")

with col2:
    st.metric("Users", "1,234", "+56")

with col3:
    st.metric("Conversion", "3.4%", "-0.2%", delta_color="inverse")

Status Messages and Alerts

Communicate application status, information, warnings, and errors to users.

def success(body: str) -> DeltaGenerator:
    """
    Display a success message with green styling.
    
    Parameters:
    - body: The success message text
    """

def info(body: str) -> DeltaGenerator:
    """
    Display an informational message with blue styling.
    
    Parameters:
    - body: The information message text
    """

def warning(body: str) -> DeltaGenerator:
    """
    Display a warning message with yellow styling.
    
    Parameters:  
    - body: The warning message text
    """

def error(body: str) -> DeltaGenerator:
    """
    Display an error message with red styling.
    
    Parameters:
    - body: The error message text  
    """

def exception(exception: Exception) -> DeltaGenerator:
    """
    Display an exception with full traceback.
    
    Parameters:
    - exception: The Exception object to display
    """

Usage Example

import streamlit as st

# Status messages
st.success("Operation completed successfully!")
st.info("Here's some helpful information.")  
st.warning("This action cannot be undone.")
st.error("An error occurred during processing.")

# Exception display
try:
    result = 1 / 0
except ZeroDivisionError as e:
    st.exception(e)

Magic Write Function

Universal display function that intelligently renders different data types.

def write(*args, **kwargs) -> DeltaGenerator:
    """
    Magic function that displays almost anything.
    
    Parameters:
    - *args: Variable arguments of various types to display
    - **kwargs: Keyword arguments passed to specific display functions
    
    Supported types:
    - str: Displays as markdown
    - pandas.DataFrame: Displays as interactive dataframe
    - dict/list: Displays as JSON
    - matplotlib.pyplot.Figure: Displays as chart
    - PIL.Image: Displays as image
    - And many more...
    """

Usage Example

import streamlit as st
import pandas as pd
import matplotlib.pyplot as plt

# Write can display many different types
st.write("Hello **world**!")  # Markdown
st.write({"key": "value"})    # JSON
st.write(pd.DataFrame({"A": [1, 2], "B": [3, 4]}))  # DataFrame

# Multiple arguments
st.write("The answer is", 42, "!")

Help and Documentation

Display help information and documentation for Python objects.

def help(obj) -> DeltaGenerator:
    """
    Display help documentation for a Python object.
    
    Parameters:
    - obj: Any Python object to display help for
    """

Usage Example

import streamlit as st
import pandas as pd

# Display help for a function
st.help(pd.DataFrame)

# Display help for built-in functions
st.help(len)

Install with Tessl CLI

npx tessl i tessl/pypi-streamlit@1.16.0

docs

caching-config.md

charts-media.md

custom-components.md

display-elements.md

index.md

input-widgets.md

layout-containers.md

tile.json