[Resolved] Header Logo is Blurry

Hi Ray

Thanks for your support. The challenge is that your logo has a lot of detail but the default logo height restriction is 92px. Because of the small text in your logo, it’s quite hard to make it out unless the logo is much bigger. If you had an alternative, horizontal logo, it would be much better suited to Ultra’s style of header.

Here is what you can try:

1. Appearance > Customize > Additional CSS and insert:

.site-header .site-branding img {
    max-height: 120px;
}

You can then adjust the logo restraint as required.

2. Go to Appearance > Customize > Theme Design > Header and adjust the Header Height setting to compensate for the larger logo.

3. Finally, whatever max-height you settle on in step 1, ideally, you need to save your logo at that height. Right now it’s 1000px x 1000px which isn’t helping. So for example, if you decide on 150px logo max-height, save your logo, cropped tightly to be 150px x 150px and then your retina logo 300px x 300px.