As a designer, you may need to create social media graphics on a daily basis. Many people started using Figma for this. It comes with all the essential features for creating professional social media posts.
But many people have this issue of blurry exported images. So they are looking for a Figma alternative. If you’re in that place, don’t do it.
You can easily fix this issue
If you get a blurry image from Figma then you are not alone. A lot of people are experiencing this problem in the Figma community forum.
In this guide, we will show you how to fix this Blurry image issue easily using two simple methods:
How to Fix Blurry Figma Images Easily (Method 1)
1. Choose The Correct Dimensions
Choosing the right dimensions for your image should be your first step before you begin designing.
Create an image with a resolution of 1080x1080px if you are designing for Instagram.
The standard sizes are
- Facebook Profile Picture: 180 x 180 pixels
- Instagram Profile Picture: 320 x 320 pixels
- Instagram Carousel Post: 1080 x 1080 pixels
- Instagram Story: 1080 x 1920 pixels
Resolution determines the quality of your image. Also, you need to choose high res icons and clip art for your designs.
2. Create Your Design
Start designing your images. It is always recommended that you use high-quality images when creating your designs. This will increase the quality of your output.
Tip: Use Icons8 or Material Design Icons plugin for high-quality icons.
3. Click on Export
Once your design is complete, click on Export, then choose your desired file format. Till this, every step is the same as you normally exported. The next step is crucial in fixing the blurriness.
4. Export in 2x
Lastly, we need to choose 2x in the Export column. By default, it is set to 1x. You can increase the quality of output by increasing this. This will increase the size and resolution of the image.
As it retains the quality after compression, PNG is preferable for social media designs. In the suffix column, enter your output file name. Click on Export. Isn’t it easy?
In most cases, the blurriness will be resolved. However, if it still does not work for you, please proceed to the next method.
Compared to the first method, this method is time-consuming. Try this method only if the above method is not working for you. It involves exporting your designs into PDFs and converting them. Follow along
1. Create Your Design
Create a new design based on the standard dimensions. Like i mentioned earlier be sure to use high-quality images for your designs.
2. Export it as a PDF
The next step is to export the design into a PDF file.
For this, you have to click on Export and select PDF then tap on Export.
Now your file will be exported as a PDF file. You may wonder why PDF. It’s because unlike PNG or JPEG PDFs retain more clarity and crispness when they are exported.
3. Convert to PNG
In this final step, we are using an online tool for converting our PDF file to PNG/JPEG.
As a result, the PNG file has much more quality than usual.
Why Are My Figma Images Blurry?
It can be a result of using low-quality images for your designs or you’re exporting in low resolution. When you upload your design to social media, it becomes blurry sometimes. This is not Figma’s issue.
You might notice that when you upload a video or photo to most social media sites, compression occurs.
This means that all photographs uploaded to the social media’s website will have slightly lower quality. The purpose is to reduce server load, save space, and support slower connections.
By following the above methods, you can easily fix this issue.