☰
×

Working with Images, Audios, and Videos with Streamlit

Chapters
Multimedia Streamlit Feature

You can easily add references, introductions, explanations, etc in the form of media files for your ML/data app seamlessly now.

Streamlit offers to easily upload your media files like images, audio, and videos or embed them from a website.

Table of Contents
1. Images
2. Videos
3. Audios

Images

You can add images from your device or simply provide a URL to embed them in your workflow using st.image()and PIL library of Python

import streamlit as st

from PIL import Image

st.write("## Image example:- ")

img = Image.open("dogs.jpeg")
st.image(img)
Image Streamlit 1

You may simply embed an image from a link using st.image(<URL>)

#From URL

st.write("## Image from URL example:- ")

st.image("https://cdn.britannica.com/q:60/49/161649-050-3F458ECF/Bernese-mountain-dog-grass.jpg")
Image Url Streamlit

Videos

Uploading videos to your ML app is easy with Streamlit using function st.video(). You may also specify a start time of the video using property start_time (in seconds) from where the video must begin. 

video_file = open("sample.mp4", "rb").read()

st.video(video_file, start_time = 3)

There are 2 play buttons but one is inside the screen recording. Please click on the lower one to play the video.

You can also embed video from any free video-sharing website like YouTube using st.video(<URL>) 

st.video("https://www.youtube.com/watch?v=DrKLYvLPidw")
Url Video Streamlit

Audios

You can showcase audio in your Streamlit app using st.audio() and embed from a website using st.audio(<URL>)

Note that the URL from where you are embedding the audio from must contain a valid audio file extension like mp3, wav, etc.

st.write("## Audio file example")

audio_file = open("audio-sample.mp3", "rb")

st.audio(audio_file.read())
Audio File Streamlit
st.audio("https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3")