A life coach launched her Wix website after spending weeks getting the content right. The site looked clean on desktop. A week after launch, she checked it on her phone and noticed the header logo was showing up so large it took up half the screen above the fold, pushing all the nav content down.
She'd uploaded a 1200px wide PNG as her logo — technically a high-resolution file, which seemed like the right idea. But Wix's header was displaying it at its native 1200px width, which at mobile viewport width meant it was occupying nearly the full screen.
Wix is one of the most popular website builders for small businesses and service providers. It handles logo placement reasonably well if you give it the right file at the right size. Here's every placement and what to upload where.
The Four Logo Contexts in Wix
1. Header Logo (primary)
The header logo appears at the top of every page on your website. It's the primary brand identifier across the entire site.
How Wix handles it:
- You upload the image through the Wix Editor or Dashboard
- Wix displays it at the width you specify in the header settings
- On mobile, the header scales down and your logo scales with it
Recommended upload:
- Width: 200–400 pixels (for logos that display at 120–200px on desktop)
- Upload at 2x your intended display size for retina sharpness
- PNG with transparent background
- Keep the actual logo artwork within 80% of the image width — don't let it go edge-to-edge
The mobile issue: Wix's mobile header often displays logos at a larger percentage of screen width than you expect. If your uploaded logo is very wide, it can appear oversized on mobile. Test on an actual mobile device, not just the mobile preview in the editor — the preview isn't always accurate.
To control logo size: In the Wix Editor, click your logo → drag the corner handles or use the "Width" field in the properties panel to set a specific pixel width. Wix respects this setting across devices, with mobile showing a proportionally smaller version.
2. Favicon
The favicon appears in browser tabs and bookmarks. Wix has a dedicated favicon upload in the site settings.
Upload location: Dashboard → Settings → Favicon
Recommended size: 32x32 pixels minimum, 96x96 or 192x192 recommended Format: PNG (Wix generates the .ico file automatically from your upload)
Use only your icon mark — not your full wordmark — as the favicon. At 16–32 pixels, a wordmark is completely illegible. See the favicon from logo guide for full detail on creating a proper favicon.
Common mistake: Uploading the same logo as both header image and favicon. The header logo and favicon have fundamentally different requirements. Wix handles them separately for good reason.
3. Social Share Image (OG Image)
When someone shares your Wix website on social media (LinkedIn, Twitter/X, Facebook, WhatsApp), a preview card appears with an image pulled from your site. If you don't specify a custom social share image, Wix grabs a random image or shows a default.
Upload location: Dashboard → SEO → Social Share (or Settings → Social Share in the Wix SEO setup)
Required size: 1200x630 pixels (standard Open Graph image size) Format: JPEG or PNG Important: This is NOT just your logo. The social share image should be a designed card that includes your logo plus context — your brand name, a tagline, or a relevant image. A standalone logo on a white background as the OG image looks unprofessional when shared.
Build this as a designed image: your logo in the upper-left or centred, your brand colour background, and a key message or visual. 1200x630 gives you space to make it look intentional.
4. Wix Owner App Logo
If you manage your Wix site through the Wix Owner mobile app, your site's logo appears in the app's interface. This uses the same file as your header logo — no separate upload needed. However, it reinforces why a clean, high-quality PNG matters: it appears in a context you might not have considered.
Step-by-Step: Uploading Your Logo in Wix
Header logo:
- Open Wix Editor
- Click on the header area → Click the logo/image element
- Click "Change Image" → Upload your transparent PNG
- Resize using the width field or corner handles to your desired display size
- Click "Save" and then check mobile view
Favicon:
- Go to Dashboard → Settings → Favicon
- Click the upload area → Upload your icon mark PNG (at least 96x96)
- Save
Social share image:
- Dashboard → Marketing & SEO → SEO → Settings (or search "Social Share" in Dashboard)
- Under "Social Share Preview," upload your designed 1200x630 image
- Write the title and description that appears alongside the image in social previews
Logo Quality on Wix: What Causes Blurriness
Wix compresses images when you upload them. This compression is usually invisible for photos but can make logos with sharp edges and flat colours look slightly soft. To counteract this:
Upload at higher resolution than you need. If you want your logo to display at 160px wide, upload at 320px wide (2x). Wix's compression is less visible at higher source resolutions.
Use PNG for logos, not JPEG. JPEG compression creates artefacts around sharp edges — the compression algorithm "blurs" the transition between your logo and the transparent background. PNG compresses differently and preserves hard edges.
Check the result at 200% zoom in a browser. Open your published site in Chrome, right-click the logo, "Open image in new tab," then zoom to 200%. If the edges are clean, the logo is rendering correctly. If there's a halo or blur around the edges, re-export at higher resolution.
Wix Logo Maker: When Not to Use It
Wix has a built-in logo maker (Wix Logo Maker, powered by AI). It's convenient for placeholder branding if you need something functional while your real brand is being designed. However:
- Output is a raster PNG/JPEG — no vector files are provided on the free tier
- The designs are template-based and non-exclusive (other Wix users may use the same template)
- The logo won't scale cleanly to print or large format without visible quality loss
- If you use it for your real brand long-term, you don't own a true vector file
If you're serious about the brand, use a professionally designed logo that comes with proper vector source files. The logo design process guide covers what a proper logo project should deliver. For logos that need to be vectorized after the fact — including Wix Logo Maker outputs — our vectorization service produces production-ready files.
Wix-Specific Gotchas
The "logo" field vs placing an image: Some Wix templates distinguish between the official "Logo" element (which has settings that affect mobile and site-wide behaviour) and simply placing an image in the header. Always use the dedicated Logo element — it integrates with Wix's mobile settings properly.
Mobile header collapse: On mobile, Wix often collapses the header to a hamburger menu. Your logo may appear at a very small size above the hamburger icon, or in a different position than on desktop. Check the mobile layout separately in the editor.
Transparency on different backgrounds: If your site has both light and dark sections with the header floating over them (sticky header), your logo needs to look good on both. A dark logo works on white backgrounds but disappears on dark backgrounds. Consider using Wix's "scroll effects" or conditional header settings if your design requires this flexibility.
Get Wix-Ready Logo Files
We prepare the transparent PNG, favicon mark, and social share image your Wix website needs — all from one clean vector source.
Upload at 2x your intended display size for retina sharpness. If you want the logo to display at 160px wide, upload at 320px. PNG with transparent background. Then use the Wix Editor to set the display width explicitly — don't rely on Wix's default sizing, which can be too large on mobile.
Go to Dashboard → Settings → Favicon and upload a PNG of your icon mark at 96x96 pixels or larger. Wix generates the browser favicon from this image automatically. Use only your icon mark, not your full wordmark — favicons display at 16–32 pixels.
Upload a higher-resolution file. If you're displaying at 160px, upload at 320px or 400px. Use PNG, not JPEG — JPEG compression creates visible artefacts on logos. Check the live site at 200% browser zoom to confirm the logo renders cleanly.
You uploaded a large image and didn't set an explicit display width in the editor. Open the Wix Editor, click the logo element, and set a specific pixel width (100–150px for most logos) in the Width field. Wix will scale proportionally on mobile.
Only as a placeholder. Wix Logo Maker produces template-based raster images with no vector source files. For a real brand, use a professionally designed logo that comes with AI/EPS/SVG files. The Wix-made logo can't scale to print, won't be unique, and doesn't give you the files you'll need for merchandise, signage, or professional use.
In the Wix Dashboard, go to Marketing & SEO → SEO → Settings, then update the Social Share Image. This controls what image appears when your site is shared on social media. Design a 1200x630 pixel image — not just your logo — that represents your brand when previewed in social feeds.
Quick Answers
My Wix logo has a white box behind it even though I uploaded a PNG. Why?
The PNG was saved with a white background instead of transparency. Re-export from your design software with transparency enabled (look for the checkerboard pattern). In Photoshop: hide background layers before exporting. In Illustrator: File → Export → PNG, ensure background is transparent.
Can I use an SVG logo on Wix?
Wix supports SVG uploads in the media library. However, for the header logo, PNG is more reliable across all Wix templates and editor versions. SVG support in Wix's editor is sometimes inconsistent. Use PNG for header and favicon.
My Wix favicon still shows the Wix default. What's wrong?
Check that you've published the site after updating the favicon — changes in the Dashboard don't go live until you publish. Also clear your browser cache (Ctrl+Shift+R) to force a fresh load.
Does Wix compress my logo and reduce quality?
Yes, Wix applies compression to uploaded images. Offset this by uploading at 2x your intended display size, using PNG format, and checking the published site (not just the editor preview) for quality.
I updated my logo but the old one still shows on my Wix site.
Upload the new file, replace the old logo element in the Wix Editor, then publish. If the old logo still appears, clear your browser cache. If visitors still see the old version, the change may take a few hours to propagate through Wix's CDN.