📺 How to Display Media Files in Streamlit (Images, Videos, and Audio)

Streamlite (Part 3)

📚Chapter: — Streamlite

If you want to read more articles about Machine Learning Libraries , don’t forget to stay tuned :) click here.

Introduction

So far in this series, we’ve covered everything from simple widgets to data display. Today, we’ll go one step further — let’s learn how to add media files like images, videos, and audio into your Streamlit app.

This is useful if you want to:

• Showcase product demos

• Add visual content to a data dashboard

• Embed audio or training clips in educational apps

Let’s get started.

📦 Step 1: Import Required Libraries

Before displaying any media, we need to import the right libraries

import streamlit as st

from PIL import Image

• streamlit: the main library for our web app.

• PIL (Python Imaging Library): used to open and manipulate images.

🖼️ Adding an Image to Streamlit

You can add images in two ways:

1. From a local file

2. Directly using a URL

📁 Option 1: Load from Local File

Make sure the image is in the same folder as your Python script

img = Image.open("st.jpg") # Load the image
st.image(img, caption='Sample Image') # Display it in the app

🌐 Option 2: Load from URL

You don’t need to save the image on your machine.

st.image("https://upload.wikimedia.org/wikipedia/commons/thumb/3/38/Streamlit_logo.svg/320px-Streamlit_logo.svg.png")

🎥 Adding a Video to Streamlit

Videos can also be displayed using st.video(). Just open the file in binary read mode (rb).

# Start video at 25 seconds
st.video(video_file, start_time=25)

Optional: Start at a Specific Time

You can start the video from a certain second using start_time.

# Start video at 25 seconds
st.video(video_file, start_time=25)

🔊 Adding an Audio File to Streamlit

Like videos, audio files are also opened in binary mode.

To add audio we have to use our open() and pass in the name of our audio file and use the “rb” mode that is read in binary mode. And later we have to display it in our streamlit so, use the audio(), in our streamlit and pass in the variable in which you saved your opened video file.

audio_file = open("audio.mp3", "rb") # Load the audio file
st.audio(audio_file) # Play in the app

You can use this for:

• Podcast previews

• Narrated tutorials

• Sound classification projects

🧪 Try It Out

Here’s a complete example with all media types:

import streamlit as st
from PIL import Image

# Image
img = Image.open("st.jpg")
st.image(img, caption="This is an image")

# Video
video_file = open("Day83.mp4", "rb")
st.video(video_file)

# Audio
audio_file = open("audio.mp3", "rb")
st.audio(audio_file)

Just save your files in the same folder as your .py file and run:

streamlit run your_script.py

✅ Summary

Media TypeFunctionFile ModeImagest.image()Not neededVideost.video()'rb'Audiost.audio()'rb'

🎯 Call to Action

Liked this tutorial?
👉 Subscribe to our newsletter for more Python + ML tutorials
👉 Follow our GitHub for code notebooks and projects
👉 Leave a comment below if you’d like a tutorial on vectorized backpropagation next!

👉, Streamlite: Enroll for Full Course to find notes, repository etc.

👉, Deep learning and Neural network: Enroll for Full Course to find notes, repository etc.

🎁 Access exclusive Supervise Leanring with sklearn bundles and premium guides on our Gumroad store: From sentiment analysis notebooks to fine-tuning transformers—download, learn, and implement faster.