Sizing your logo artwork for your theme

All our themes allow users to upload their own logo artwork in place of the Site Title. You can do this by going to Appearance > Customize > Site Identity. Learn more about all controls in the Site Identity customization tab here.

One big thing to keep in mind when sizing artwork for your logo: the final sizing is completely dependent on the logo artwork itself. So, while you can try out the recommendations below, you may need to tweak your artwork slightly based upon its layout and various elements.


EDITING THE LOGO FOR YOUR BLOG (HEADER)

Our themes have a max logo container width of 1100px, or 1200px. While you could upload a logo file that is this large, baring a specific design that is meant to span the width of a page, a logo that is this big edge-to-edge will look far too large within your theme.

We think an optimal size for any logo is a width of 600-800px in width, depending on how tall the artwork is, too. However, if you are optimizing your blog for Retina displays, you should double the total width of any image you are uploading. Our Customizer features a space for you to upload your logo artwork for both standard displays (@1x) and Retina displays (@2x). It looks like this:

You do not have to upload both in order for your logo to work, so if you only have artwork for one, that’s ok.

For more information about images for Retina displays and why they matter, read this article.


Here are some examples that show you how a logo might look at various sizes of upload:

At the max width of 1100px (@1x) / 2200px (@2x)

Too big! The logo takes up too much space, and pushes the content too far down the page. Generally speaking, we do NOT recommend uploading your artwork at the max allowable width of the logo container.


At a “medium” size of 800px (@1x) / 1600px (@2x)

This looks better. For logos that are completely inline (i.e., there’s no monogram, symbol or other artwork above or below it, this size will likely work for you).


At a “smallest” size of 600px (@1x) / 1200px (@2x)

Ding ding ding. This looks the best! Note that this size works the best for this particular logo, since it’s pretty tall and wide overall. If your logo is simply your blog’s name in a pretty font, you might be able to get away with uploading it a bit larger, at 700px/1400px, or at 800px/1600px.

For all blogs, we do not recommend sizing your logo beneath 600px (@1x) / 1200px (@2x) in width, as artwork smaller than this may look too small and lose detail on mobile devices.


EDITING THE LOGO FOR YOUR BLOG FOOTER

Some themes offer the ability to upload a logo near the bottom of the page, i.e. in the page footer. Themes by default will show a text based version of your logo, rendered in the primary font of the font family you’ve chosen for your theme. You can remove this text based version of your logo by checking Hide Site Title in footer:

Similarly, if your theme offers it, you can upload a version of your logo to the footer. It does not have to be the same logo you used as the top of the page — it can be any artwork you desire! Depending on the artwork, we recommend playing around with the overall width to achieve the look you want. For footers in which the logo is sitting atop a colored background, we recommend creating and uploading a .PNG version of your logo, with a transparent background.