Image Guidelines

The ratios below are recommended for images that will be used for all pages created within AEM. Consider these ratios when developing or editing images for Zebra's digital properties to ensure the composition is consistent with the Zebra Brand Guidelines. Please provide images in the maximum size below and note the image may be cropped for the different aspect ratios for use in multiple locations and pages. Images must not contain any text unless it is specific to a brand/logo because copy embedded into an image can not be translated.

Image Requirements

  • Format:
    • .jpg
    • .png for product images or other images where a transparent background is needed such as logos
  • Resolution: 72 dpi
  • Source File: if available; e.g., .psd or .tiff

Recommended Image Ratios and Usage

3:1 Ratio

Usage: to showcase application or environment imagery for large screen hero images and carousels at the top of a page. The 3:1 ratio can also be used as banners or section separators to create a visual rhythm on long scrolling pages.

  • Not recommended for individual product images unless demonstrating the product length 
  • Use for product groupings if spanning the width of the page
  • It is recommended to use a 16:9 ratio on smaller screens to make the image more visible.

Maximum Size(px)
: 1920px wide x 640px high

16:9 Ratio

Usage: a versatile ratio that can be used to focus on Zebra products in environment for imagery in columns 50% or less. This ratio can also be used for an image intended to cover the entire screen when using the Background Image Layer component.

  • Video previews 
  • Small screen versions of images using the 3:1 ratio

Maximum Size(px)
: 1920px wide x 1080px high

3:2 Ratio

Usage: individual product images on white backgrounds. This ratio can also be used as an aternative to the 16:9 ratio if the composition of the image requires additional height.

Maximum Size(px): 1920px wide x 1280px high

1:1 Ratio

Usage: typically used for thumbnail images, the 1:1 ratio is also used for the Page Properties Image and components that create a circle image, such as the Circle Promo.

Maximum Size(px): 1920px wide x 1920px high