🔍 Anatomy of a Wallet Pass (Apple vs. Google)
Both Apple and Google Wallet support similar field types, but the layout and terminology vary slightly. Don’t worry — you don’t need to design two separate passes. Badge handles the formatting for you behind the scenes.
Element | Apple Wallet | Google Wallet |
Logo | Top-left of pass | Left-aligned in header |
Cover Image | Banner across the top | Hero image beneath the logo |
Icon | Push notification thumbnail | Collapsed view + list thumbnail |
Top Field | "Header field" | "Title" |
Primary Info | "Primary field" | "Subtitle" |
Secondary Info | Additional fields (front + back of pass) | Inline modules |
Barcode | Supports QR, PDF417, Aztec, Code128 | Supports QR, Aztec, Code128 |
Back of Pass | Detail view accessed via menu on the top right— includes extra fields, links, and static info | Detail view accessed via menu on the top right— includes extra fields, links, and static info |
🧠 Some visual and field behaviors depend on the pass type (Event, Offer, Loyalty, etc.).
👉 See design playbooks by pass type
🔧 What You Actually Need (Just 3 Assets)
In the Design section of the pass editor, you’ll see three image fields. These are the only assets you need to create a pass that looks great on both Apple and Google Wallet.
✅ 1. Logo (Required)
Used in:
Apple Wallet: Top-left of pass
Google Wallet: Left side of header
Tips:
Use a PNG with transparent background
High-contrast, simple shapes work best
Ideal dimensions: 480×150px (or narrower)
✅ 2. Cover Image (Required)
Used in:
Apple Wallet: Banner at top of pass
Google Wallet: Hero image under logo
Tips:
Recommended size: 1125×432px
Avoid text near the edges (may be cropped)
Use brand-forward visuals or promotional imagery
🟡 3. Icon (Optional)
Used in:
Apple Wallet: Push notification thumbnail
Google Wallet: Collapsed card view and list view
Tips:
Square format preferred (e.g. 256×256px)
Keep it simple and recognizable
Upload for full control, or use our auto-generated fallback
🟢 Optional: Google Wallet Cover Image Override
Upload a different image just for Google Wallet (e.g. a GIF or wide-format promo)
Same recommended size: 1125×432px
✅ TL;DR — Design Checklist
Asset | Required? | Where It's Used | Design Tip |
Logo | ✅ | Header (Apple + Google) | Transparent PNG, simple logo |
Cover Image | ✅ | Top banner / hero image | No text near edges |
Icon | Optional | Notifications + collapsed views | Upload for control, auto-generated by default |
Google Override | Optional | Google Wallet only | Great for animated promos or wide layouts |
🧪 You can preview how your pass looks in both wallets right from the editor.
🎨 Design Tips That Work Across Wallets
These universal tips will help your pass look polished and perform well, no matter what platform your users are on:
✅ Keep text minimal — highlight only what matters
✅ Use high-contrast logos with transparent backgrounds (PNG recommended)
✅ Avoid overly detailed cover images — they appear small on many phones
✅ Stick to one clear call-to-action, like “Use Now” or “Scan to Redeem”
✅ Test your pass preview on both Apple and Google views before publishing
💡 A wallet pass is a glanceable, functional object — less is more.
🎯 Designing for Specific Pass Types
Depending on your use case, you might want to format your pass differently. Certain fields or image behaviors are pass-type-specific — especially in Apple Wallet.
👉 Browse our design playbooks for guidance based on what you’re building:
Use Case | Best For | View Guide |
Event Ticket | Ticketing, check-in, timed entry | |
Loyalty Card | Membership, perks, status tiers | |
Gift Card | Stored value, prepaid credit, incentives |
🎬 What’s Next?
Once your design assets are uploaded, you can:
Add dynamic fields like user name, status, balance, or event info
Preview the pass and test it in Apple & Google Wallets
Layer on additional native features like setting locations or native recommendations
When you’re ready, move on to distribution and push or pass takeover campaigns.