Customizer

How to Configure Responsive Logo Widths

By Daniel Ekay May 18, 2026 2 min read
Docs Customizer How to Configure Responsive Logo Widths
Share:
Last updated:

Aurora gives you independent width controls for your logo at each screen size, so it scales down gracefully on smaller devices without you having to upload separate images.


Header Logo Widths

Go to Appearance → Customize → Layouts → Header Layout and look for the header logo width controls:

Header Layout panel showing Header Layout Style, sticky toggle, logo width, primary button text and link fields
Customizer Site Identity panel showing logo upload, site title, tagline and favicon fields
Setting Default Range
Desktop logo width 80px 40px – 400px
Tablet logo width 70px 40px – 400px
Mobile logo width 60px 40px – 400px

Footer Logo Widths

The footer has its own logo and its own set of width controls. Go to Appearance → Customize → Layouts → Footer Layout:

Footer Layout panel showing style dropdown, recent posts style, number of posts, custom logo, logo width, social links toggle, Footer Bio and column title fields
Setting Default Range
Desktop logo width 150px 40px – 400px
Tablet logo width 150px 40px – 400px
Mobile logo width 150px 40px – 400px

The footer logo is separate from the header logo. You can upload a different image for each. The footer logo only appears on footer layouts that support it; the Stripped layout does not include a logo area.


Tips

  • Upload your logo at 2× the maximum display size you intend to use so it stays sharp on high-density screens.
  • If your logo looks too large on mobile, reduce the mobile width setting rather than uploading a smaller image.
  • The width controls set the rendered width; height scales proportionally to preserve the logo’s aspect ratio.

Make your blog stand out

Enjoy the ease and flexibility of Aurora. Create stunning blog designs your readers will love, with live preview editing and effortless template mixing and matching enabled.

Get Aurora today for just $39

Get Aurora