How to increase logo size on dawn theme without increasing header size?

To increase the logo size on Shopify's Dawn theme without increasing the header size, follow these steps:

1. Modify the CSS for the Logo Only

You need to target the logo's max-width or height without affecting the overall header size.

Option 1: Adjust Logo Size via Custom CSS

1. Go to Online Store > Themes > Click Customize on the Dawn theme.
2. Click on Theme settings (bottom left).
3. Go to Custom CSS and add this code:

.header__heading-logo {
    max-width: 200px !important; /* Adjust as needed */
    height: auto !important;
}

Option 2: Modify Logo Size in Base CSS

If the above doesn't work:

1. Go to Online Store > Edit Code.
2. Open base.css (in Assets folder).
3. Add this code at the bottom:

.header__heading-logo {
    max-width: 200px !important; /* Change the value to increase logo size */
    height: auto !important;
}

2. Ensure Logo Resizes on Mobile

For responsiveness, add:

@media screen and (max-width: 768px) {
    .header__heading-logo {
        max-width: 150px !important; /* Adjust for mobile */
    }
}

3. Save & Check

• Save the changes and preview your store.
• Adjust the max-width value until the logo appears as expected.

This method increases the logo size only while keeping the header height unchanged. 🚀