Skip to main content
Question

Background blur bug in autolayout frame

  • November 2, 2022
  • 5 replies
  • 1247 views

victoriaklarissa

I’m creating a website design with a header in glassmorphism style. However, when I scroll the page in prototype, this container with background blur becomes buggy, with a white blurred line behind it. I ran some tests and conclude this only happens in autolayout (my whole website page is an autolayout). This really ruins the aesthetics of my webpage and I need to present this prototype soon. I don’t know how to fix it.

5 replies

Tjark
  • 5 replies
  • November 2, 2022

Hi, could you maybe share your file with us, so we can take a closer look? Would be great. Otherwise, try looking for a line in the layers panel or try to select by draging in the area where the line is visible and then check in the layers panel if there is an object that’s not supposed to be there.


victoriaklarissa

Hi, there’s no real line in the frame, since it is an autolayout. My guess is that it is blurring the prototype background, but I don’t know… Here’s the file link: https://www.figma.com/file/FI22bU5FVoQVHg0IePO0uL/Untitled?node-id=0%3A1


Tjark
  • 5 replies
  • November 2, 2022

Yeah, sorry, my mistake. I found a solution, but sadly you won’t have an auto-layout only project anymore.

Just put your auto-layout in a frame. That’s it.

Edit: Changing the background color (top right corner) of your file to black (a darker color) will also fix it. Then you won’t need a frame at all. Hope this helps.


victoriaklarissa

hey, changing the file background color really helps! thank you so much!


Tjark
  • 5 replies
  • November 2, 2022

Glad I could help. Good luck with your project and have a nice day!


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