I had the same reaction but the weird thing is: it looked ok in FireFox..?

Not OK on mobile Firefox: displacement maps do not apply, so there's no actual refraction, the liquid feeling; there's only the specular effect at the edges. Try opening it in a Chromium-based browser and compare.

▲

yreg 4 days ago | parent | prev | next [-]

Yeah, curious. The mentioned backdrop-filter seems to be supported everywhere

https://caniuse.com/?search=backdrop-filter

▲

Cu3PO42 4 days ago | parent [-]

backdrop-filter is supported by all major browsers, but specifically using SVG filters, which are more powerful and is out-of-spec, is only supported in Chromium-based browsers.

	▲	freehorse 4 days ago \| parent \| next [-]
		Not sure if this is relevant, but while moving the slider around, in chromium i see 40% gpu utilisation, while in firefox less than 20% (macbook m3 pro). I do not observe any noticeable difference otherwise in terms of quality. PS Neat website and explanations, but talking about the liquid glass as a design principle in general, I would rather ui elements in a random website not use that much of gpu for not great reasons but maybe that's my problem of not thinking different.
	▲	bfgeek 4 days ago \| parent \| prev [-]
		> which are more powerful and is out-of-spec These are in the specification here: https://drafts.fxtf.org/filter-effects-1/#typedef-filter-url And used by backdrop-filter here: https://drafts.fxtf.org/filter-effects-2/#BackdropFilterProp...

▲

fuzzy2 4 days ago | parent | prev | next [-]

The backdrop-filter thingy most definitely does not work in Firefox. Everything above does.

It works on Chromium-based browsers but it does not look great, probably needs some filtering.

▲

mirekrusin 4 days ago | parent | prev [-]

Try on chromium based browser - it's much better.