How to Create Glassmorphism Effect in Figma
Jan 28, 2021
Hi everyone,
We created a short guide on how to create the glassmorphism effect in Figma and we thought that it might be useful for you too!
As we learned in the previous ELH challenge, the glassmorphism effect looks like a frozen glass with a blurred background as you can see in the example below.
Here you can find short instructions on how to create the glassmorphism effect in Figma (it's a free online design tool) - https://fastercourse.com/how-to-create-glassmorphism-effect-in-figma/
I also attached the Storyline 360 file with the above example where you can place your newly created file from Figma and see how it looks.
I hope this might be useful for someone and if you have any questions, let me know :)
10 Replies
Wow! This is gorgeous, Karlis! Thanks for sharing the story file with the community!
Sure, no problem! I hope it might be helpful for someone 🙂
Helpful to me Karlis, thank you!
This is incredible! Thank you!!
Incredible example! Thank you very much for sharing this. May I ask how you added the video in the background? I assume you placed it in a frame in Figma and exported it as an MP4 file with the blurred card on it. I'd like to do the same and would appreciate an explanation. Many thanks!
This post was removed by the author
Hi! I get it now. Thank you very much for your explanation!
I am glad you liked our template! That is the whole point of this community :).
Definitely, many thanks!
Would love to hear what you think! https://community.articulate.com/discussions/building-better-courses/glassmorphism-challenge-weather-conditions-and-precautions