figma pixelated image

Why is my Figma image pixelated?

As a UX/UI designer I use Figma everyday for all kinds of stuff, and I love it, I might write a review on it in the future. But there has been one issue that I have had a couple times, and I have now found out what was going on and how to fix it.



Sometimes you need to take screenshot of existing websites or flow when designing something new, for quick reference or just as inspiration. What can sometimes happen is you have a nice crisp image, place it in Figma and it shrinks it, when you scale it up to its actual size it pixelates it… why?



Figma has a build in size limit for images of 4000 pixels, so any image larger in either height or width will be down scaled to fit… In a bad way.



To get around this you can either make your image smaller but that much not work too well. Or, and this is what I do: Crop the image into parts, so top, middle and bottom. Then you easily place them back into Figma all nice a crisp. And simply join the image back together.


Problem, Solved!

Luke Dowding
I’m a UX/UI Designer & Web Developer from the UK. I’m Vegan, love Cycling, Running, Gaming and F1. Aka: Roamy
September 19, 2017