How To Glass Morph (Only CSS)!!

sumanta_thefrontdev

SumantaWeb

Posted on September 26, 2021

How To Glass Morph (Only CSS)!!

The Things you need are simple..

A Good Background Image(to be blurred)
Some HTML Code..

So The Thing Which needs to be glassmorphed give it a class(eg. glassMorphism);

Then Style it..
After The Style giving it a border radius(transparent);

then paste this code--

"
background-color: rgba(255, 255, 255, 0.3);
backdrop-filter: blur(5px);

"

Done!!
*Remember : It Should Have Padding.
Then you can change blur and color as you like.

💖 💪 🙅 🚩
sumanta_thefrontdev
SumantaWeb

Posted on September 26, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related