The short version
- Product Hunt recommends 1270×760 pixels for gallery images and a square 240×240 thumbnail under 3 MB.
- A launch needs at least two gallery images before the gallery shows, but five or six give you room to tell a full story.
- The strongest gallery runs in order: a hook, the problem, the product, the features, how it works and a closing call to action.
- Every gallery image should share one background, one type style and one caption position, so the set reads as a single product.
- Product Hunt's video field takes a public YouTube link, so a short screen recording of the product doing its job belongs there.
On this page
Product Hunt gallery images are uploaded at 1270×760 pixels, a wide frame close to 5:3, and the separate square thumbnail is 240×240. You need at least two for the gallery to appear, and you can drag them into any order. The size is the easy part. What wins the scroll is the sequence: six frames that tell one story, hook first, call to action last, all in the same look so a visitor never wonders whether the next image belongs to the same product.
Product Hunt image size: gallery, thumbnail and video
These are the numbers Product Hunt's own launch page gives today. Check the upload form on launch day in case they change.
Size
Rules worth knowing
Size
Rules worth knowing
Rules worth knowing
Gallery image 1270×760
1270 × 760
Thumbnail 240×240
240 × 240
Open Graph 1200×630
1200 × 630
A gallery sequence that tells the story
Most launches upload screenshots in the order they were taken. A visitor then sees a settings panel before they know what the product is for. Plan the gallery like a short deck instead: each image has one job and one line of words, and together they answer what it is, who it helps and why now.
What goes on it
Example line
Job
What goes on it
Example line
Job
What goes on it
Example line
Job
What goes on it
Example line
Job
What goes on it
Example line
Job
What goes on it
Example line
Slot one carries the most weight, because it is the image people see first on your launch page. Put the promise there, not a logo on its own. Keep slot four free of proof you have not earned: no invented user counts, no customer logos you do not have, no star ratings. Features stated plainly are more convincing than numbers nobody can check.
Slot 1, the hook: name, promise and a supporting line. Readable at a glance.
Slot 2, the problem: one sentence on the same ground, so it reads as the next frame.
Slot 5, how it works: three steps in plain words.
Slot 6, the call to action: what to do next and where to go.
Keep one ground across every gallery image
A gallery is seen as a strip of frames, and the eye notices the odd one out before it reads anything. Use the same background, the same heading font, the same caption position and the same margin on every image. Screenshots then sit on that ground like objects on a table, rather than each one bringing its own white page. Same discipline as a carousel: one design, many pages.
Avoid
- Raw screenshots with different window sizes and white edges
- A new background colour on every slide
- Captions that jump from top to bottom between images
- Six fonts because each slide was made on a different day
- A logo-only first image that says nothing
Do
- One background behind every image, screenshots placed on it
- One heading style and one caption position throughout
- The same margins, so crops line up as you click through
- A promise on slot one, a next step on slot six
- The thumbnail cut from the same ground, so feed and page match
The simplest way to hold this together is to build the whole gallery as pages of one design at 1270×760. In Gradiently every page wears the same Mark, so the background, light and type voice stay identical from slot one to slot six, and changing one setting changes the whole set.
Captions people can read at gallery size
The gallery is shown smaller than you design it, and the thumbnail is tiny. Write captions of six words or fewer, set them large (aim for a cap height of at least 40 px on a 1270×760 frame) and keep one line per image. Strong visual hierarchy beats clever layout here.
Words over a gradient fail where the colours behind them change from light to dark across a single line. Pick a calm area for text, or let the background make room. In Gradiently, Auto ink picks light or dark type per line from the Mark's own palette, so a caption stays readable wherever it sits. More on the technique in text on gradients.
Where a video or screen recording fits
Product Hunt's video field takes a public YouTube link, not an upload. Keep it short and show the product doing its main job from start to finish, with captions burned in for people watching without sound. A plain screen recording often explains more than a polished animation. See screen recording tips and product demo video for the recording itself.
For motion inside the gallery, a GIF is the option, since gallery slots accept animated GIFs. Keep it to one short loop of a single interaction, framed on the same ground as the still images, and make sure the first frame works on its own.
How to make Product Hunt gallery images, step by step
- 1
Write the six lines first
Fill in the sequence table above before you open any design tool. If a slot has no clear line, the product story has a gap to fix.
- 2
Set up one 1270×760 design
Create a custom size of 1270×760 and choose the background, heading font and caption position once. Add six pages to the same design.
- 3
Capture clean screenshots
Hide personal data, use realistic fictional content, and crop each screenshot to the part that proves the line next to it.
- 4
Place one idea per page
Line, optional detail, one visual. Same margins on every page so the frames line up as visitors click through.
- 5
Check legibility small
View every page at thumbnail scale. Fix any caption that sits over a busy patch or a light-to-dark change.
- 6
Make the thumbnail from the same ground
A 240×240 square with your icon or a short word on the same background. Keep it under 3 MB.
- 7
Export and upload in order
Export PNG at 1270×760, name files 01 to 06, upload, then drag to reorder if needed. Add the YouTube link last.
Once the gallery is done, the same pages give you the rest of launch day: an X post, a link preview and a header. Indie hacker launch graphics covers that wider kit, and a waitlist page built on the same look keeps people who arrive early in the same world.
Questions people ask
What size are Product Hunt gallery images?
Product Hunt recommends 1270×760 pixels for gallery images. You can upload larger images in the same proportion, such as 2540×1520, for sharper display on high-density screens.
What is the Product Hunt thumbnail size?
The thumbnail is a square, recommended at 240×240 pixels and under 3 MB. A GIF thumbnail only animates on hover, so its first frame needs to work as a still image.
How many gallery images does Product Hunt need?
At least two before the gallery shows on your launch page. Five or six let you tell the full story: hook, problem, product, features, how it works and a call to action.
Can I add a video to my Product Hunt gallery?
Product Hunt has a separate video field that takes a public YouTube link with the full URL. For motion inside the gallery itself, upload an animated GIF.
What should the first Product Hunt gallery image show?
Your product's name and its promise in one line, on the same background as the rest of the gallery. A logo on its own wastes the most viewed slot.
Written by Gradiently
The team behind Gradiently, a design tool built around Marks: living gradients that make everything you design look like yours.
See our profile