Adding a custom logo for Retina screens
Retina screens are high-resolution screen (like iPhone, iPad and MacBook Pro screens). Special care must be taken to ensure your logo looks perfectly clear and crispy.
To upload your logo, open the Theme Settings. In the "Sections" tab, click on "Header":
Once you have entered into the "Header" section, locate the "Logo" sub-section:
The recommend size varies based on your theme. Please refer to the theme settings in your theme.
In order to have a logo that looks good on Retina screen, here is the trick: you must prepare your image in twice the resolution, and enter a value in "Custom logo width".
For instance, let's say that you want your logo to appears in "200x40" (200 pixels wide, 40 pixels tall): you will need first to prepare your logo (in your favorite image editor) to be twice the resolution. In this case, your logo should be 400x80 (400 pixels wide, 80 pixels tall). Make sure that your logo still look good at this size.
Then, upload the logo in the theme settings, and in "Custom logo width", indicate your size as you want to see it in the screen (so, in our example, you would enter 200).