Lottiefile created with Figma not displaying on Safari and Firefox

Hello there! I created a simple animation on Figma where some shapes go up and down or change dimension, which I would like to set in loop on my homepage.
On crome the file works well, while on Safari and Firefox the animation is not displayed at all.
Do you have any idea on how to fix this?

The animation is supposed to be shown on the right of this webpage: vm • Rationale AI

I cannot get it to display on my chrome browser, do you have a direct link to the lottie? What did you use to make the website (Webflow, Wordpress)?

Wow three weeks passed and I even didn’t notice… Sorry for the late reply!
Here the json: https://rationaleai.app/wp-content/uploads/2023/07/Home-Header-v1.json
And I’m using wordpress with Semplice as teme

Hey @f.santaniello I just checked in Chrome and Safari and it works fine, I did upload it to my account and share it with myself to check. I wonder if this link will show you the animation on your end. I enabled public view and handoff so you can see.

My only guess is the CMS that you built the site with (lets assume webflow) has the container set incorrectly on the Z-axis and it might be behind some element.

https://app.lottiefiles.com/share/31e95670-dce2-4b58-a4ce-0b3fbb2fa422

Yes, the link you shared works for me too.
Mhm probably it’s something linked to the player of my wordpress theme then?

Mostly likely. With wordpress they should have a lottie plugin to let you insert the JSON file.

1 Like