Mobile Wallet Best Practices

Image Dimensions

add company logo to apple wallet pass

Rectangular Logo for Apple Wallet Passes

Apple Wallet uses a rectangular image for the logos on Passes. See the recommended image specs below:

apple wallet logo dimensions

File Type: PNG
Recommended Sizes: 160px by 50 px, 320px by 100px or 480px by 150px
Additional Info: The logo image always is displayed in the top left corner of the Pass.

add company logo to gpay pass

Circular Logo for Google Pay Passes

Google Pay uses a square image for the logos on Passes that will be masked into a circle. See the recommended image specs below:

gpay pass logo dimensions

File Type: PNG
Minimum Size: 660px by 660px
Maximum Size: 840px by 840px
Additional Info: The logo image is displayed on the top middle section of the Pass. The actual pixel size will scale to the device size. The logo will be masked to fit in the circular design. The logo should be left in a square with a full bleed background color within a 15% margin.

icon for apple wallet notifications

Icon Image for Apple Only fields

Icon images are used for Apple Wallet Passes and are displayed when a Pass is shown on the lock screen of the device, in notifications, and emails, if attached.

File Type: PNG
Size: 58px by 58px & 200 KB
Additional Info: Image sizes greater than 200 KB will be compressed automatically. Do not use transparent images. A shine effect will be automatically added to the icon.

strip image example

Strip Image

The strip image is used by both Apple Wallet and Google Pay Passes and gets displayed as a banner across the center of the Pass.

strip image dimensions

File Type: PNG
Size: 1032px by 336px
Additional Info: It is recommended to use an image will a colored background for the best results.

Additional Image for Google Pay

Google Pay Passes allow for an additional image to be used below the Pass.

File Type: PNG
Minimum Size: 1860px wide, variable height.
Additional Info: It is recommended to use a wide, rectangular image with a colored background for the best results.

Carrier Alliance Logo for Boarding Passes

A Carrier Alliance Logo may be added below the barcode for Boarding Passes for both Apple Wallet & Google Pay.

File Type: PNG
Square Image Size: 80px by 80px
Rectangle Image Size: 1600px by 80px
Full Width Image Size (Without Padding): 1600px by 80px
Additional Info: The recommended size for all images is 80px tall and between 80px-1600px wide.

Fonts

Font Colors

On Google Pay Passes, Google will determine the correct font color for your Pass depending on the background color. For darker backgrounds, the text color will be set to white. For lighter backgrounds, the text color will be set to black. The font color may be customized on Apple Wallet Passes. It is recommended to follow the same guidelines used by Google to determine the font color for Apple Wallet Passes.

Barcodes

qr code

QR Code

Max. Char.
100

pdf 417

PDF 417

Max. Char.
100

code128

Code 128

Max. Char.
80

aztec code

Aztec

Max. Char.
100

Additional Fields

Links

Web Links

When adding a link to a website in the additional fields, http/https is required at the beginning of the link. Web Links can be added to the Message 1, Message 2, Message 3, Home Page URL, Help URL, Text Module, Info Module, Link 1 or Link 2 fields. On both Apple Wallet and Google Pay Passes, the web link will be clickable. When clicked, web links will open a new browser window. Links to websites will appear with an icon to the left of the text on Google Pay Passes, that will only appear when the web link is added in the Link 1 or Link 2 fields. The icon will not appear on Apple Wallet Passes.

Correct Link Format: https://www.skycore.com
Incorrect Link Format: www.skycore.com or skycore.com

Phone Numbers

Phone numbers can be added to the Message 1, Message 2, Message 3, Text Module, Info Module, Link 1 or Link 2 fields. The area code is required when adding a link to a phone number to a Pass. The country code is not required, although it is recommended. On both Apple Wallet and Google Pay Passes, the phone number link will be clickable. When clicked on an Android device, the dial pad will open with the phone number from the Pass pre-filled. When clicked on an IOS device, a box will appear with the phone number and two buttons to either ‘Cancel’ or ‘Call’ that number. Clicking a phone number link will NOT automatically call that number. It is recommended to leave out any parentheses, dashes, or spaces in the phone number, although it is not required to do so. On Google Pay Passes, the phone number will be a clickable link and appear with a phone icon to the left of the text, that will only appear when the phone number is added in the Link 1 or Link 2 fields. The icon will not appear on Apple Wallet Passes.

Correct Phone Number Format: 16173147688
Incorrect Phone Number Format: (617) 314-7688

Email Addresses

Email addresses can be added to the Message 1, Message 2, Message 3, Text Module, Info Module, Link 1 or Link 2 fields. On both Apple Wallet and Google Pay Passes, the email link will be clickable. When clicked, the default email app used on the device will open and fill out the to: field with the email address that is on the Pass. Clicking an email link will NOT automatically send an email to that email address. Links to email addresses will appear with a mail icon to the left of the text on Google Pay Passes, that will only appear when the email address is added in the Link 1 or Link 2 fields. The icon will not appear on Apple Wallet Passes.

Correct Email Format: bizdev@skycore.com

Geolocations

Geolocation links can only be added in the Link 1 or Link 2 fields. Links to geolocations can be added using the latitude and longitude of the location. Use the Address Lookup Tool to find the geocoordinates of the location using an address. Links to geolocations will appear with a location icon to the left of the text on Google Pay Passes. The icon will not appear on Apple Wallet Passes.

Correct Geolocation Format: 42.3694407,-71.23743869999998

Map Links

Links to Google Maps can be added to the Message 1, Message 2, Message 3, Text Module, Info Module, Link 1 or Link 2 fields. Http/https is required at the beginning of the link. On both Apple Wallet and Google Pay Passes, the Google Maps link will be clickable. When clicked, links to Google Maps will open a new browser window. Map links will appear with a location icon to the left of the text on Google Pay Passes, that will only appear when the map link is added in the Link 1 or Link 2 fields. The icon will not appear on Apple Wallet Passes.

Correct Map Link Format: https://maps.google.com/maps/@23.003079,72.515438

Ordering of the Additional Fields

The ordering of the fields on the back of Apple Wallet Passes is consistent with the order shown on the Pass Template Builder. The ordering of the fields below the Google Pay Pass may not be consistent with the order shown on the Pass Template Builder.

in Mobile Wallet