How to Design Apple’s Liquid Glass Effect in Figma (with Texture + Constraints!)
Texture in Figma is so fun to design with.
You can even make Apple’s Liquid Glass with it!
Couple things to consider:
Adding texture will warp the whole frame/grouphigher numbers in texture make it less “in your face”
So when you’re creating a ui design with a liquid glass button, you can’t add texture to the button without warping the whole thing.
That’s where constraints come in! Inside an auto layout layer, add a rectangle with the texture and faded white. Then resize it so it’s bigger than the button wrapper. Set the constraints to scale and now changing text will scale the texturized inner layer.
Just add a background blur to that layer along with the texture and now you’ll have liquid glass in your ui design right inside of Figma!
Btw I saw a breakdown from BrettFromDJ that showed a more complicated less dynamic version of this! Check his content for different approaches!
#figmadesign #uidesign #liquidglass #figmatutorial