Fixing Header Logo Alignment & Display Issues in Shopify (Dawn Theme)

If your Shopify header logo looks misaligned, stretched, blurry, or jumps between desktop and mobile, this guide will help you fix it safely without breaking your theme.

Step 1: Upload the Correct Logo Size

Recommended logo size for Dawn:

• Desktop: 300×80px (PNG or SVG)
• Mobile: 220×60px

Step 2: Adjust Logo Settings

Go to Online Store → Themes → Customize → Header

• Reduce logo width (try 140–180px)
• Disable unnecessary padding

Step 3: Fix Logo Alignment Using CSS

.header__heading-logo {
  max-width: 180px;
  height: auto;
}

Mobile Fix

@media (max-width: 768px) {
  .header__heading-logo {
    max-width: 140px;
  }
}

✅ Result: A clean, centered, responsive logo across all devices.