Achieving Consistent Blur Effects Across Different Browsers: A Guide

Could someone please advise me on why the blur effect doesn't appear consistent across all browsers like Chrome, Firefox, and Safari? In Chrome, the blur effect doesn't display correctly, while in Firefox, it appears exactly as desired. However, in Safari, the blur effect seems to have a slight yellowish tint. Why does this occur, and how can I ensure consistency across all browsers?
Codepen link: https://codepen.io/Amit-Soni-the-vuer/pen/GRLPjax
image.png
image_2024_04_22T10_06_47_933Z.png
image.png
CodePenAmit Soni
...
blur
Was this page helpful?