Fetch Information from an iFrame using Streamlit

Hi Streamlit Community
I’m a beginner and having a great time learning and developing apps using Streamlit. I am writing my first post to seek help on a Use Case as I wasn’t able to find an exact/close solution on Streamlit Community (Apologies if a topic already exists, could you please direct me to it).

What I Have:
A Powerpoint which has animations on shapes. The shapes change colour on-click

What I Want:

  1. Being able to display this animation within Streamlit interface
  2. Once the user clicks on the shapes, I would like to record the shape colours that were selected by the user

Current Status:
I was able to call the PPT using the iFrame feature in Streamlit. The iFrame allows me to change colours upon clicking

I’m Struggling with:
How to (what approach) should I follow to capture the colours of the shapes I selected within the iFrame

I tried exploring iFrame, Dynamic Component, but have been unable to have a Eureka moment.

I’ll really appreciate if you could please advice how to accomplish this, OR guide me to existing similar posts which I can adapt.

The pptx file with animated shapes is available here: here

I look forward to your reply.


Not sure what you’re trying to achieve here. Perhaps post a video of the PPT animating and changing colours on clicks, as I don’t see it doing that.

PPT Online is a closed system and supports simple embedding, as you have done. For programmatic access and control, I think you’d need to use JavaScript API for PowerPoint - Office Add-ins | Microsoft Learn within a custom Streamlit component. You may be able to get a long way with a “plain old HTML/JS component” design, which I wrote about here: Introduction to Streamlit and Streamlit Components.

Learn about building more advanced components here: Components - Streamlit Docs.