Back to Blog
Guides 2026-10-18 5 min read

Product Hunt Gallery Images: Sizes, What to Put in Them, and How to Make Them

WhixFrame Team

App marketing tools built by developers who've shipped 20+ apps to the App Store and Google Play.

On launch day, most visitors to your Product Hunt page spend a few seconds deciding whether to care. They read the tagline, glance at the gallery, and either keep scrolling or click through. The gallery does more of that convincing than anything else on the page, and it is the part makers most often throw together at 2am the night before.

This guide covers the sizes, what each gallery image should do, and how to make a consistent set quickly.

The sizes you need

AssetSizeNotes
Gallery images1270×760The recommended size. Images at this ratio display without awkward cropping.
Thumbnail240×240The square icon next to your product name. An animated GIF is allowed.
TaglineUp to 60 charactersNot an image, but it sits right above the gallery and frames it.

You can also add a video to the gallery. If you have a short demo, it is worth including, but a video does not replace good still images: many visitors never press play.

Three to six is the sweet spot. Fewer than three looks thin, and past six people stop scrolling. Quality and clarity matter far more than count.

A structure that works for most products:

  1. The overview. The product doing its main job, with a headline that says what it is. This is the image nearly every visitor sees, so make it the clearest picture of the product.
  2. Key feature one. One screen, one headline about what the user gets.
  3. Key feature two. Same format.
  4. Key feature three, if you have a third that matters.
  5. The result or the hook. A before and after, a metric, a testimonial, or the pricing promise ("Free for solo makers").

One idea per image. Each image should make a single point you could say in a few words. If you need a paragraph to explain an image, it is two images, or it belongs in your first comment.

A headline on every image. Raw screenshots force people to work out what they are looking at. A three to six word headline ("Find any file in one keystroke") does that work for them. Name the benefit, not the screen: "Never miss a renewal" beats "Notifications settings".

Frame the screenshot. A screenshot floating on a plain white background blends into the page. Put it in a browser window for a web app, a laptop for a desktop app, or a phone for a mobile app, on a background with some color. The frame instantly tells people what kind of product it is.

Keep one style across the whole gallery. Same background, same frame, same headline position. A consistent set looks intentional and professional. A gallery where every image looks different looks like it was assembled from whatever was on hand.

Use real, believable data. Empty states and "Lorem ipsum" make a product look unfinished. Fill a demo account with realistic content before you capture anything.

Make text big enough. Gallery images are often viewed at a fraction of their full size, especially on phones. If a headline is not readable when the image is a few hundred pixels wide, make it bigger.

Common mistakes

  • Uploading the landing page as a screenshot. Your marketing site is not the product. Show the product.
  • Tiny interface text as the focus. Crop in on the part that matters instead of showing the whole window.
  • Mismatched sizes. Mixing 16:9, square, and tall images makes the gallery jump around as people scroll.
  • A thumbnail that is a detailed logo. At 240×240, shown tiny in a list of dozens of launches, a bold simple mark wins. A subtle animated GIF can help it stand out.
  • Leaving it to the last night. Make the gallery a week early, show it to a few people, and ask what they think the product does. If they cannot tell, fix the overview image.

You can design gallery images in Figma, but you do not need to. Our free Product Hunt Gallery Maker is built for exactly this:

  1. Paste or drop a screenshot.
  2. Pick a browser, laptop, or phone frame and a background. Keep them the same for every image.
  3. Write the headline and subheadline.
  4. Download at 1270×760 and repeat for each feature.

It runs entirely in your browser with no signup. Downloads carry a small watermark.

For a more polished set, Screenshot Studio has a Product Hunt gallery format. Describe the look you want in the chat, add your screenshots, and the AI designs every image in one consistent style with a background, lighting, and a headline written for each screen. You can then edit any headline directly on the canvas.

Reuse the set for the rest of the launch

The same scene that makes a good gallery image also makes the rest of your launch assets, and matching visuals across channels make the launch feel like one coordinated event:

  • Link preview (OG image): export the overview image at 1200×630 so links to your site and launch post look the same. See how to make an OG image.
  • X post: 1600×900 for the launch announcement.
  • LinkedIn post: 1200×627.

All of these sizes are in the Launch Image Size Guide.

  • 3 to 6 images at 1270×760, plus a 240×240 thumbnail
  • Overview image first, one feature per image after that
  • A short benefit headline on every image
  • Same background, frame, and layout across the set
  • Realistic demo data, no empty states
  • Readable at a few hundred pixels wide
  • Matching OG image and social posts ready for launch day

Start with the free Product Hunt Gallery Maker, and good luck with the launch.

Last updated: 2026-10-18 · Written by the WhixFrame team based on first-hand experience shipping apps to both stores.