Site Branding
Customize your store's visual identity to create a consistent brand experience across all customer touchpoints. Your branding settings control how your store appears to customers, from the logo in your header to the colors used throughout your site.
Prerequisites
- Access to your store's dashboard
- Admin or Member role for your site
- Logo files in PNG, JPG, or SVG format (recommended: transparent PNG)
Brand Logo Settings
To configure your store's logos, navigate to Dashboard > Site > Brand.
Logo Light
Your primary logo displayed on light backgrounds. This logo appears in:
- Store header
- Invoices and order confirmations
- Customer account pages
Recommended specifications:
- Format: PNG with transparent background
- Dimensions: Minimum 200px width
- File size: Under 500KB for optimal loading
Logo Dark
An alternative version of your logo for dark backgrounds. If you enable dark mode for your store, this logo will be used instead of the light version.
Best practice: Create a white or light-colored version of your logo that contrasts well against dark backgrounds.
Favicon
The small icon that appears in browser tabs and bookmarks. Your favicon helps customers identify your store when they have multiple tabs open.
Recommended specifications:
- Format: PNG or ICO
- Dimensions: 32x32px or 64x64px
- Square aspect ratio
App Icon
Used when customers add your store to their home screen on mobile devices. A high-quality app icon creates a more professional appearance.
Recommended specifications:
- Format: PNG
- Dimensions: 512x512px
- Square aspect ratio with rounded corners (optional)
Open Graph Image (og:image)
The image displayed when your store is shared on social media platforms like Facebook, Twitter, or LinkedIn. A compelling og:image can significantly increase click-through rates from social shares.
Recommended specifications:
- Format: PNG or JPG
- Dimensions: 1200x630px
- Include your logo and a brief tagline
Air Waybill Logo
Displayed on shipping labels and air waybill documents. This should be a professional version of your logo suitable for printing.
Best practice: Use a high-contrast version that prints clearly in black and white.
Email Logo
The logo that appears in transactional emails sent to customers (order confirmations, shipping updates, etc.).
Tip: Consider how this logo will look against the email header background color you configure below.
Email Header Image
An optional header banner image for your transactional emails. This appears at the top of emails above the content.
Brand Colors
Configure colors that reflect your brand identity and are applied throughout your store.
Primary Brand Color
Your main brand color used for:
- Primary buttons
- Links and interactive elements
- Highlighted sections
- Cart and checkout accents
How to set: Click the color picker or enter a hex color code (e.g., #3B82F6).
App Color
The theme color used for the mobile app experience. This affects:
- Browser address bar color on mobile
- Splash screen background
- Mobile app theme color
Air Waybill Color
The accent color used on printed shipping labels and waybill documents.
Email Header Color
The background color of the header section in transactional emails. Ensure this color provides good contrast with your email logo.
Tip: Use a dark background with a light logo, or a light background with a dark logo for best readability.
Saving Your Changes
After configuring your branding settings:
- Review all your uploaded images and color selections
- Click the Save button at the bottom of the form
- Changes take effect immediately across your store
Note: Browser caching may cause logos to appear unchanged initially. Customers may need to clear their cache or perform a hard refresh to see updates.
Best Practices
- Maintain consistency - Use the same logo variations across all channels
- Test on multiple devices - Check how your branding appears on desktop, tablet, and mobile
- Consider dark mode - If you enable dark mode, ensure you have appropriate logo variations
- Optimize file sizes - Compress images without losing quality for faster page loads
- Use high resolution - Upload images at 2x the display size for crisp appearance on retina displays
Related Documentation
- Site Setup - Configure your store settings
- Quick Start - Initial store setup guide