Branding & Logo
How to upload your logo, set a favicon, choose brand fonts, and make your storefront instantly recognisable as your brand.
Consistent branding — your logo, favicon, and color palette — builds trust with customers and makes your store instantly recognisable. All branding settings live in Settings → Store details and the Theme Editor.
Uploading your logo
Your logo appears in the header, the footer, and any branded emails Sellrn sends on your behalf (order confirmations, shipping notifications).
- Go to Settings → Store details → Logo.
- Click Upload logo and select your file.
- Click Save. The logo updates instantly on your storefront.
Logo file requirements:
| Format | Recommended | Max size |
|---|---|---|
| SVG | Yes — scales perfectly at any size | 500 KB |
| PNG (transparent) | Yes — use if you don't have SVG | 2 MB |
| JPEG | No — white background shows on dark headers | — |
Dark mode logo
If your logo is dark (e.g. black text on transparent), it will be invisible on a dark header background. Upload a separate dark mode logo — typically a white or light version of the same mark — in Settings → Store details → Dark mode logo. Sellrn swaps automatically between the two based on the visitor's color scheme preference.
Favicon
The favicon is the small icon shown in browser tabs and bookmarks. Go to Settings → Storefront → Favicon and upload a square image. Requirements:
- PNG or ICO format.
- At least 32 × 32 px; 512 × 512 px recommended for high-DPI displays.
- Should be a simplified version of your logo — complex logos become unreadable at 16 px.
Brand fonts
Set your heading and body fonts in the Theme Editor → Typography tab. Sellrn includes a selection of Google Fonts plus a "System" option (no external font request, fastest load time).
For premium brand fonts not in the Google Fonts library, add a custom@font-face rule in Settings → Advanced → Custom CSS and reference the font name in the Theme Editor's custom font input.
Brand colors
Set your primary brand color in Theme Editor → Colors → Primary. This color is used for buttons, links, active states, and highlights across the entire storefront. For a complete brand color system, set:
- Primary — main interactive color (buttons, links).
- Background — page background (white, off-white, or dark).
- Foreground — body text color (near-black or near-white).
- Accent — secondary highlight color for badges and callouts.
Social share image
When someone shares a link to your store on social media, platforms show a preview card. Set your default OG image (Open Graph) in Settings → SEO → Social share image. Recommended size: 1200 × 630 px. Individual pages can override this image in their page settings.