Go Back
How to Set a Figma File Thumbnail
Figma

How to Set a Figma File Thumbnail

Pierluigi Giglio
September 27, 2023

When you’re designing, it is important how clean your work is. How well your message comes across from the very start. And that is precisely why thumbnails are important. 

Thumbnails give the first look of the content to anyone who sees it – it sets the first impression. And first impressions are essential.

So, do you want to learn how to create and set Figma thumbnails, like these ones?

Figma file thumbnails

There’s nothing too complicated. Keep reading!

How to create a thumbnail in Figma

Yes, we are sure you do know how to design the thumbnail by yourself if you are here. That’s entirely up to you. However, the dimensions that Figma allows to set a thumbnail in are not customizable. 

What size is a Figma thumbnail?

We’d suggest you stay inside the 1600 x 960 dimension for a proper fit. So when you create your frame, resize it to fit the 1600 x 960 dimensions.

How do I create the thumbnail in Figma with the proper dimensions?

First, create a new frame.

Create frame

Then navigate through the panel that appears on the right side of the screen when you click on the frame. 

Make sure the dimensions are assigned to W (width): 1600 & H (height): 960.

Frame dimensions

You can now design anything you want within these dimensions, and they will display correctly on the file thumbnail.

Here is a visual representation of how big the canvas you’ll work on is:

Visual representation of canvas size

Plenty of space to work in!

How to set a Figma file thumbnail

This bit is extremely easy. You’ll just need to right-click over the frame you want to set as a thumbnail and choose Set as thumbnail from the options.

That will set your frame of choice as a thumbnail.

Set as thumbnail

How to remove a Figma file thumbnail

Right-click on the frame once again, and choose Restore default thumbnail from the options.

Restore default thumbnail

That’s it!

We hope this guide helped you learn how to create, set, and remove thumbnails on Figma files. 

If you want to learn more about Figma, please visit our other resources and recent articles!

ABOUT THE AUTHOR
Pierluigi Giglio

Sr. UI/UX Designer and Consultant with over 10+ years of experience working with Fortune 500, large enterprises and funded startups. Having worked on hundreds upon hundreds of design projects, collaborated with 40+ clients from all around the world and taught design to thousands of students I am very grateful that I have the opportunity to give back to the design community and help other become better designers.

Enjoyed this read?

Stay up to date with the latest design news and cutting-edge softwares, sent straight to your inbox!

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.