What's your biggest current challenge? Have your say in Community Polls along the right column.

Why my logo on iphone looks pixelated, but not on android?

Why my logo on iphone looks pixelated, but not on android?

h_vare
Shopify Partner
10 0 1

Im using Dawn theme.
On Android phones, logo looks perfect and not pixelated. On iphone it looks bad. The mobile logo is just a svg image. 

This is my store url: https://artchimiaofc.com/

Reply 1 (1)

Sweans
Shopify Partner
428 88 126

Hi @h_vare,

 

iOS sometimes requires the SVG to be embedded directly into HTML for better quality. Instead of uploading it as a separate file, try embedding the SVG code directly in the theme file.

 

Also,

 

Apply the below CSS in your theme file:

1.Go to your Shopify admin panel.

2.Navigate to Online Store > Themes.

3.Find your theme and click on Customize.

4.Click Actions > Edit code.

5.In the left sidebar, under the Layout directory, select base.css. Add the below code:

 

 

header__logo img { 
    max-width: 100%; 
    height: auto; 
}

 

 

Save the changes.

 

If none of the above work, you could replace the SVG with a high-resolution PNG as a quick fix, though SVGs are preferable for scalability.

 

I hope this helps! If it does, please like it and mark it as a solution!  
If you need further assistance, feel free to reach out!

Regards,
Sweans

- Was my reply helpful? Please Like and Accept the Solution or let me know by Buying me coffee!
- Want to modify or custom changes on store Hire me.
- Feel free to contact me at info@sweans.com regarding any help.
- To know more about me check out www.sweans.com