Creating GitHub Marketplace listing images
When creating a GitHub Marketplace listing, you're required to provide images such as logos and screenshots. These guidelines will help you create those images.
Logo and badge images
GitHub Marketplace displays all listings with a square integration logo image inside of a circular badge. You can choose a background color for this badge, which can be used to visually distinguish your app in the GitHub Marketplace.
Tips for logo and badge images
- Upload an image that is at least 200px x 200px to avoid upscaling images on GitHub Marketplace listings.
- If possible, upload a square logo with your logo in the center, as logos will be cropped to a square.
- You can use transparent PNGs if you'd like to lay your logo on top of a badge's background color.
- You can assign a badge color to match the background color (or transparency) of a logo image to give the appearance of a seamless badge.
- You should avoid using logos with words or text in them as they do not scale well to small sizes.
When browsing GitHub Marketplace, people can see up to five screenshot images for an app. These images are displayed within a carousel. Thumbnail navigations are provided to switch from one image to the next. Each screenshot may have an optional caption to help add context.
Tips for screenshots
- Images should be of high resolution (at least 1200px wide).
- Images should all be the same height and width (aspect ratio) to avoid page jumps when users navigate from one image to the next.
- Try to show as much of the user interface as possible to help visually explain what your app does.
- Avoid showing your app in Chrome, as this does not scale well to smaller screen sizes.
- Images are shown within a box, so you don't need to include another box around your screenshot.
- Captions are most effective when they are short and snappy.
Feature cards are displayed in a carousel at the top of the GitHub Marketplace homepage, to promote GitHub Marketplace listings.
A feature card is a rectangular background image that contains the GitHub Marketplace listing's badge and name. A short description of the listing is displayed underneath the feature card. The background image should have some texture to give your feature card a sense of identity and allow it to stand out against the background color on the GitHub Marketplace homepage.
Tips for feature cards
- Background image measures 965px by 482px (width x height).
- Text shows up clearly over the art.
- Background image contains a bit of texture.
- Feature card captures your brand personality.
To start creating a GitHub Marketplace listing, see "Listing an app on GitHub Marketplace".