Skip to main content
Question

Blur to CSS


Vladimir3


Good day. I think I found a bug in the Figma editor. The styles that it generates do not work correctly in the browser. Can anyone please help me?

5 replies

Emile_Paffard-Wray

Do you have a link to the code for inspection?


Vladimir3
  • Author
  • 2 replies
  • April 25, 2021

Yep. Use it:
position: absolute;
width: 80px;
height: 80px;
right: 0px;
bottom: 0px;
background: rgba(21, 27, 30, 0.25);
filter: blur(80px);
backdrop-filter: blur(16px);

Figma promises that such an element will create a soft and smooth blur and darkening of the background that is under it. The browser creates a hard lens with sharp edges.


Emile_Paffard-Wray

Sorry Vladimir I didn’t see this earlier, will take a look later if I get time.


Vladimir3
  • Author
  • 2 replies
  • July 19, 2021

Can you help me? I have been looking for a solution for several months


anwar_abbasi

you can blur background in css by using following code pro zone

background: rgba(255,255,255,0.5);
backdrop-filter: blur(5px);

Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings