MARKETPLACE
PLUGINS
LIQUID GLASS EFFECT – LIKE APPLE UI
Liquid Glass Effect – Like Apple UI logo

Liquid Glass Effect – Like Apple UI

Published February 2026
   •    Updated February 2026

Plugin details

It transforms ordinary Bubble elements and groups into smooth, Apple-style liquid surfaces. The plugin applies real glass-like background blur and light refraction, dynamically sampling and diffusing the content behind the element to create a natural frosted-glass depth effect while preserving clarity of foreground content.




       

MAIN FEATURES:
🎯 Target Any Element – Apply effects to Groups, Shapes, etc. via ID
🌊 SVG Turbulence – Generate organic, non-repeating liquid noise patterns
🔮 Glassmorphism Blur – Real-time background frosting (backdrop-filter)
🧬 Custom Distortion & Blur – Control the intensity of the liquid "wobble" and blur effect
🎨 Reactive Colors – Adjust tint, borders, and shadow color instantly
🎛️ Seed Control – Randomize patterns without changing the texture

Features:

➡️ Target Any ID: Simply assign an ID Attribute to any element in your Bubble editor, and this plugin will apply the liquid effect to it.

➡️ Two Effect Types: Choose between Liquid and Glassmorphism. Liquid creates a distorted water-like surface, while Glassmorphism adds a frosted glass blur. You can also achieve a frosted look in Liquid mode by increasing blur intensity while keeping the distortion across grouped elements.

➡️ Organic Fluid Simulation: Utilizes filters to create mathematically generated, natural-looking liquid textures that never look pixelated.

➡️ Adjustable Turbulence: Fine-tune the "roughness" of the liquid. Low values create smooth, molten waves, while high values create grainy, frosted textures.

➡️ Glass Frost Effect: Built-in support for frosty blur, allowing you to create trendy frosted glass effects that blur the content sitting behind the liquid element.

➡️ 3D Depth Styling: Automatically applies custom highlighting borders and inner shadows to give the liquid shape a sense of volume and 3D depth, rather than looking flat.

➡️ Distortion Scale: Control how dramatically the edges of your element "drip" or "warp." Go from subtle organic wobbles to extreme abstract art.

➡️ Color & Tint Control: Full RGBA support for the liquid's base color, allowing for transparent tints that blend seamlessly with your page background.

➡️ Seed Randomization: Change the Seed value to instantly generate a completely new variation of the liquid pattern while keeping your roughness settings intact.

➡️ Performance Optimized: The plugin ensures the effect runs smoothly and doesn't slow down your page layout.


*Note: If you have a feature or plugin request, feel free to contact us.*

Other Plugins

$16

One time  •  Or  $6/mo

stars   •   0 ratings
1 installs  
This plugin does not collect or track your personal data.

Platform

Web

Contributor details

Snipcode logo
Snipcode
Joined 2022   •   28 Plugins
View contributor profile

Instructions

1. Search for liquid_ui_effect in the elements panel and place it on the page. (Do not hide this element) 2. Set the id for the groups/elements on which you want to apply effect. (If you haven't exposed id attributes yet, go to app settings, under 'General' tab, check 'Advanced options' at the bottom and tick the checkbox, "expose the option to add an id attribute")
3. Now enter the same id inside the plugin's input field, "Element ID".
4. Customize other options as per your need.

*You can change the behavior of the effect by setting conditionals in the editor.

Types

This plugin can be found under the following types:

Categories

This plugin can be found under the following categories:
Image   •   Web Scraping   •   Small Business   •   Productivity   •   Media   •   Visual Elements

Resources

Support contact
Tutorial

Rating and reviews

No reviews yet

This plugin has not received any reviews.
Bubble