Safari filter easing issue (Chrome working fine)

Design help Animations & Interactions
1

Hi there,

I am trying to find a solution to a mouse hover interaction.

When I hover over an image it has a filter that changes the brightness and inverts it slightly to make it grey. This works fine in Chrome and Webflow, and looks very smooth. In Safari it is very choppy and the easing is not working correctly.

Safari version: Version 15.3
Chrome version: Version 114.0.5735.198 (Official Build) (arm64)

Any help would be extremely helpful.

Thank you,
Philipp

Here is my public share link: Webflow - Safari easing issue

live site: https://safari-easing-issue.webflow.io/

2

@jamesvclements @webdev @Jorge_Sahagun @vincent perhaps you can lend some thoughts as I’ve seen a similar unresolved issue in another thread.