Streamlit on HF Spaces Intermediate

Streamlit Spaces let you deploy data-rich, multi-page Streamlit applications on Hugging Face. Streamlit excels at building dashboards, data exploration tools, and interactive data apps with its simple Python API.

Setting Up a Streamlit Space

Configure your README.md for Streamlit:

YAML (README.md)
---
title: My Streamlit App
emoji: 📊
colorFrom: red
colorTo: yellow
sdk: streamlit
sdk_version: 1.37.0
app_file: app.py
pinned: false
---

Basic Streamlit App on Spaces

Python (app.py)
import streamlit as st
from transformers import pipeline

st.set_page_config(page_title="ML Dashboard", layout="wide")
st.title("ML Model Dashboard")

# Cache the model for performance
@st.cache_resource
def load_model():
    return pipeline("sentiment-analysis")

model = load_model()

# User input
text = st.text_area("Enter text for sentiment analysis:", height=150)

if st.button("Analyze", type="primary"):
    if text:
        result = model(text)
        col1, col2 = st.columns(2)
        with col1:
            st.metric("Sentiment", result[0]["label"])
        with col2:
            st.metric("Confidence", f"{result[0]['score']:.2%}")
    else:
        st.warning("Please enter some text.")

Multi-Page Streamlit App

Create multi-page apps using Streamlit's pages directory structure:

File Structure
my-streamlit-space/
  app.py                 # Main page
  pages/
    1_Sentiment.py       # Page 1
    2_Summarization.py   # Page 2
    3_Translation.py     # Page 3
  requirements.txt
  README.md

Integrating HF Models

Python
import streamlit as st
from huggingface_hub import InferenceClient

# Use HF Inference API (no model download needed)
client = InferenceClient(token=st.secrets["HF_TOKEN"])

st.title("Chat with an LLM")

prompt = st.chat_input("Ask me anything...")
if prompt:
    with st.chat_message("user"):
        st.write(prompt)
    with st.chat_message("assistant"):
        response = client.text_generation(
            prompt,
            model="mistralai/Mistral-7B-Instruct-v0.2",
            max_new_tokens=500
        )
        st.write(response)

Streamlit vs Gradio on Spaces

Feature Streamlit Gradio
Best for Data dashboards, multi-page apps ML model demos, quick prototypes
Layout Columns, tabs, sidebar, expanders Rows, columns, tabs, accordion
Data display Excellent (DataFrames, charts, maps) Good (basic tables and plots)
ML integration Manual (via libraries) Built-in (Interface API)
Embedding iframe only iframe + Web Components
Secrets Management: Use Streamlit's secrets management on Spaces. Go to your Space Settings > Repository secrets to add environment variables. Access them in code with st.secrets["KEY"].

Streamlit Space Deployed!

You can now build and deploy Streamlit apps on Spaces. Next, explore Docker Spaces for full custom environments.

Next: Docker Spaces →

Ready to Go Deeper?

Live instructor-led courses from our partners. Affiliate disclosure.