Creative Image Asset Guide

Get all details and specs for the image assets used in our Refer a Friend program.

Overview

Images bring life to your referral and engagement programs and reinforce your brand to current and prospective customers. Creating an Extole-powered program that matches the look and feel of your site or app is easy. This guide has all the information you need to provide your creative team to generate images for your program.

Key Terms

All images should be in .jpg or .png format and their size must not exceed 3МВ. You can use any online image compressor to reduce file size.

Recommended image size: This is not the actual size of the container — it has the same aspect ratio as the container, but takes into account higher PPI to maximize quality.

Aspect ratio: This is either certain or flexible. Certain means you have to upload an image of exact proportions. If an image’s aspect ratio doesn’t match the container’s aspect ratio, it will either be cropped or the empty space will be filled with a background color. Flexible means you can ignore the recommended image size.

Container behavior: This determines the vertical and horizontal behavior in relation to your browser window. Fill means the entire available width or height is filled, with the other axis scaling proportionally. If we've included a min/max parameter, that means resizing will stop once the limit has been reached. Fixed means the image size doesn’t change, though it may crop or appear as your browser window increases/decreases.

Absolute position: This means that the image doesn’t push/pull surrounding content when resized.

Refer a Friend Images

AssetActual (Container) Size (width x height)Recommended Image Size (width x height)Container Aspect Ratio (relative to uploaded image)Container Behavior (horizontal / vertical)ConstraintsLocation
Company Logo150 px wide (configurable)450 px wideflexiblefixed (absolute position)top, left (configurable)My Account / Overview - Company Details
Company Icon16 x 16 px96 x 96 pxcertaindetermined by browserdetermined by browserMy Account / Overview - Company Details
Microsite Banner Image for Desktop1400 px wide2800 x 800 pxflexiblefill horizontaltop, centerAdvocate - Microsite / Friend - Microsite
Microsite Banner Image for Mobile480 px wide1080 x 900 pxflexiblefill horizontal--Advocate - Microsite / Friend - Microsite
Share Experience Vertical Image for Desktop395 x 650 px790 x 1300 pxcertainfixed--Advocate - Share Experience
Share Experience Horizontal Image for Mobile360 x 220 px1080 x 660 pxflexiblefill horizontal--Advocate - Share Experience
Friend Landing Experience Vertical Image for Desktop395 x 650 px790 x 1300 pxcertainfixed--Friend - Friend Landing Experience
Friend Landing Experience Horizontal Image for Mobile360 x 220 px1080 x 660 pxflexiblefill horizontal--Friend - Friend Landing Experience
Social Share Image600 x 315 px1200 x 630 pxdetermined by social channeldetermined by social channeldetermined by social channelOverview - Sharing
Social Share Image for WhatsApp600 x 315 px1200 x 630 pxdetermined by social channeldetermined by social channeldetermined by social channelOverview - Sharing
Social Share Image for Pinterest300 x 300 / 300 x 450 px1000 x 1000 / 1000 x 1500 pxdetermined by social channeldetermined by social channeldetermined by social channelOverview - Sharing
Email Banner Image600 px wide1200 x 700 pxflexiblefill horizontal: max width 600 px--Overview - Emails
Email Preview Image480 x 123 px1076 x 276 pxcertaindetermined by mail agentdetermined by mail agentReward Emails
Gift Card Reward Email650 x 150 px1300 x 300 pxdetermined by our partnersdetermined by our partnersdetermined by our partners--
CTA Image When Used as Tile400 x 200 px800 x 400 pxflexiblefill horizontal: max width 400 px(configurable)top, left
CTA Icon Image When Used as Button18 px high72 px highflexiblefixed (configurable height)--Marketing
Overlay Side Image on Maximized View125 x 300 px250 x 600 pxflexiblefixed horizontal (scales popup according to container height)center, right (configurable)Marketing - Overlay