@yuanchuan Hey, I have seen your nice blog post from 2023 using css-doodle with svg filters. You said that safari had issues with the data:uri and I was trying to reproduce the issue, but I could not. Can you still reproduce or has it been fixed?

https://yuanchuan.dev/daily-sketch-4#:~:text=Safari

Daily Sketch 4 - OpenAI Cover Images

While most people are interested in ChatGPT and other products from the OpenAI company, I find myself intrigued by the generative cover images that accompanied with their blog posts and research articles. I don't know the tools they use but I love the style of the designers.

@karlcow It seems the issue is still there. I don’t have an iPhone to check the latest Safari on mobile, but on desktop Safari it still fails to recognize data-URI SVG filters in CSS.

As shown in the screenshot , Chrome renders the noisy effect (right), while Safari does not (left).

https://bugs.webkit.org/show_bug.cgi?id=104169

@yuanchuan Yes I found the bug. This is not exactly about data uri for SVG as large. But this is probably related https://bugs.webkit.org/show_bug.cgi?id=104169

Thanks for noticing.

104169 – Data URI SVG Fills/Filters

WebKit Bugzilla