🔥 Apple's Liquid Glass design in Bubble

Showcase
1

If you’re inspired by Apple’s Liquid Glass designs here’s how to build it in Bubble

4 Likes
2

That is a neat way to do it. I have not tried with the backdrop filter set to blur, I’ve used this html in some of my apps in the past.

<style>

.glass::before {
    display: block;
    background-color: white;
    background-size: cover;
    content: '';
    opacity: 0.4;
}
.glass {
 background: rgba(255, 255, 255, 0.3) !important;
}
</style>

I think your approach is a bit easier and maybe even better supported by browsers. I just tested again my setup for frosted glass on images and for some reason it doesn’t work anymore. Thanks for sharing.

1 Like