A notification with a hero image is essentially a notification in which a large image is visible below the title and message. Here's an example of how notifications look with hero images:

Windows (Chrome) and Android platforms both support hero images in their notifications. Any of your subscribers using these devices will see an enriched push notification if you include a hero image.

Dimensions for Windows (Chrome):

720px ( W ) X 480px ( H ) 

Dimensions for Android:

720px ( W ) X 240px ( H ) 

Best Practice

You can see from the dimensions above, that the length of the image supported is the same for Windows and Android. But the height of the image in Android is less than that of Windows.

In other words, if you use a hero images with the dimensions for Windows, then your image will get cropped off on Android devices. So it's advisable to use the dimensions mentioned for Android.

Furthermore, the height of the hero image supported on Android varies slightly from device to device. On smaller devices, the image will be cropped off very slightly (about 10 pixels in height).

So by taking into account a safety area for smaller Android devices, the recommended dimensions would be 720px (W) X 230px (H)

TLDR: Use 720px (W) X 230px (H) dimensions for your hero image. Alternatively you can use 720px (W) X 480px (H) dimensions and have your content / message fit within 230px height in the middle. That will give you the best fit for all Android and Windows devices.

We have also attached templates for Hero Images for Android and Windows in a simple PSD and Sketch file to make your and your designer's life easier.

Did this answer your question?