Supplying Images

You need to supply several kinds of images to be used in the Chrome Web Store and the Google Chrome browser:

• App icon
• Promotional images New! Updated guidelines and sample images
• Screenshots New! Updated sample images

Only the app icon, a small promotional image, and a screenshot are mandatory. However, providing attractive versions of both required and optional images increases your app's chances of getting noticed. For example, your app can't be featured unless you provide a large or marquee promotional image.

New image requirements: The store's look has changed. If you already have items in the Chrome Web Store, you must provide images that conform to the store's new requirements for promotional images and screenshots.

App icon

You must provide a 128x128-pixel app icon image in the ZIP file of your app. Some requirements for the image:

• The actual icon size should be 96x96 (for square icons); an additional 16 pixels per side should be transparent padding, adding up to 128x128 total image size. For details, see Icon size.
• The image must be in PNG format.
• The image should work well on both light and dark backgrounds.

The image that you provide is used to generate images in several other sizes. For example, a 96x96 version (where the icon is approximately 72x72) is used in the browser's New Tab page.

Testing tip: To make sure your icon looks good, preview your app's listing in the Chrome Web Store. If you're working on an installable web app, you also need to view your icon in the New Tab page. To do so, you can load the unpacked app, bring up the New Tab page, and then look at the icon against a variety of backgrounds by applying a few themes.

When you design the icon, keep the following advice in mind:

• Don't put an edge around the 128x128 image; the UI might add edges.
• If your icon is mostly dark, consider adding a subtle white outer glow so it'll look good against dark backgrounds.
• Avoid large drop shadows; the UI might add shadows. It's OK to use small shadows for contrast.
• If you have a bevel at the bottom of your icon, we recommend 4 pixels of depth.
• Make the icon face the viewer, rather than having built-in perspective. See Perspective for details.

Here are some icons that follow these guidelines.

Note: If you upload an image that has no alpha, it will be placed in a frame with rounded corners (12-pixel corner radius).

Icon size

All app icons should have the same visual weight, occupying roughly the same area. As the following figure shows, when you size an icon to fill the available area, square and circular icons are significantly larger than they should be, compared to icons with other shapes.

Normalizing the icon sizes, as the next figure shows, gives the icons roughly even area and visual weight.

You can use the following template images to help you judge how large your image's artwork should be. The templates show the correct size for a square and a circle, but these are merely guides; icons that have pointy bits might stray outside these areas. If an irregularly shaped icon takes up very little area and is mostly negative space, using the entire 128x128 area might be acceptable.

Template for square icons	Template for circular icons	Template for irregular icons

You can follow some rules of thumb for artwork size. For a square icon, make the artwork 96x96 pixels. For other icons that are squarish, make the artwork's width 75-80% of the total width of the image. A circular icon should have a diameter of approximately 112 pixels, or 85% to 90% of the image width. Icons with irregular shapes should have similar weights.

The following figures show square and circular icons, comparing them with the templates.

Here's an example of an irregularly shaped icon. In this case, the icon follows neither the square nor circular guidelines, but it fits near them both.

Perspective

For flexibility and consistency, app icons should be front-facing. Subtle tweaks of perspective that give a sense of tangibility are OK, but avoid dramatic angles.

Good icons (front facing)	Bad icons (too-drastic perspective)

Back to top

Promotional images

You must provide at least a small, 440x280-pixel promotional image. You can also provide other images that the store can use to promote your app.

Note: Unlike screenshots, promotional images are not currently locale-specific. If your app supports multiple locales, we recommend either avoiding text by focusing on graphical representations of the app's capabilities, or targeting the promo images to the locale in which you have the most users.

Note: If your images refer to Google brands, follow the Branding Guidelines.

Although only a small promotional image is required, you can also supply larger promotional images if you'd like your app to be featured more prominently in the Chrome Web Store. Here are the image sizes you can provide:

• Small: 440x280 pixels (required)
• Large: 920x680 pixels
• Marquee: 1400x560 pixels

Note: Apps that don't have a small promotional image will be shown after apps that do have that image. If your app was published before the small promotional image was required, you should add that image so your app can be displayed more prominently.

Promotional images are your chance to capture users' attention and entice them to learn more. Don't just use a screenshot; your images should primarily communicate the brand. Here are some rules of thumb for designing your images:

• Avoid text.
• Make sure your image works even when shrunk to half size.
• Assume the image will be on a light gray background.
• Use saturated colors if possible; they tend to work well.
• Avoid using a lot of white and light gray.
• Fill the entire region.
• Make sure the edges are well defined.

The following graphics are examples of the promotional images for an app:

Small promo image (440x280) (full size)	Large promo image (920x680) (full size)

Marquee (1400x560) (full size)

Back to top

Screenshots

You must provide at least 1—and preferably 4 or 5—screenshots of your app to be displayed in the app's store listing. If your app supports multiple locales, you can provide locale-specific screenshots as described in Internationalizing Your App.

When you edit your app's listing, mousing over a screenshot's thumbnail brings up controls that let you delete the screenshot or change its position.

Each screenshot should be as follows:

• 1280x800 pixels
• Square corners, no padding (full bleed)

As an example, here are five screenshot images for an app:

Screenshot #1 (full size)	Screenshot #2 (full size)

Screenshot #3 (full size)	Screenshot #4 (full size)	Screenshot #5 (full size)

Back to top

What next?

Next, read Publishing Your App.