This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Firefox Home (new tab) UI update sucks

  • 2 replies
  • 1 has this problem
  • Last reply by bsolj

more options

Seems like the newest Firefox update (131.0) changed the way my Home Page (on the new tab) looks. WHY??

Now there's a giant logo taking up a fifth of the vertical space, forcing me to scroll to see my shortcut icons. WHY????

Oh, and the shortcut icons are now spaced farther apart and are significantly smaller. WHY????????

I set browser.newtabpage.activity-stream.logowordmark.alwaysVisible to false but the logo is still present.

Please revert these changes. Or, if someone could provide me with some tips on how to edit the userchrome.css or whatever, that would be great.

Seems like the newest Firefox update (131.0) changed the way my Home Page (on the new tab) looks. WHY?? Now there's a giant logo taking up a fifth of the vertical space, forcing me to scroll to see my shortcut icons. WHY???? Oh, and the shortcut icons are now spaced farther apart and are significantly smaller. WHY???????? I set '''browser.newtabpage.activity-stream.logowordmark.alwaysVisible''' to '''false''' but the logo is still present. Please revert these changes. Or, if someone could provide me with some tips on how to edit the userchrome.css or whatever, that would be great.
Attached screenshots

Chosen solution

When my Firefox updated to 131.0 the logo and wordmark got SMALLER.

Here's the CSS I used to put them back to their old size. You should be able to change the values to make it as small as you wish. It needs to go in userContent.css rather than userChrome.css.

/* Restore size of the logo and wordmark on the Home/New Tab pages */ @-moz-document url(about:newtab), url(about:home) {   .logo {     background-size: 82px !important;     height: 82px !important;     width: 82px !important;   }   .wordmark {     background-size: 162px !important;     height: 80px !important;     width: 164px !important;     margin-inline-start: 20px !important;   }   }

Read this answer in context 👍 2

All Replies (2)

more options

Chosen Solution

When my Firefox updated to 131.0 the logo and wordmark got SMALLER.

Here's the CSS I used to put them back to their old size. You should be able to change the values to make it as small as you wish. It needs to go in userContent.css rather than userChrome.css.

/* Restore size of the logo and wordmark on the Home/New Tab pages */ @-moz-document url(about:newtab), url(about:home) {   .logo {     background-size: 82px !important;     height: 82px !important;     width: 82px !important;   }   .wordmark {     background-size: 162px !important;     height: 80px !important;     width: 164px !important;     margin-inline-start: 20px !important;   }   }

Helpful?

more options

Thanks! With the addition of the code below, I was able to restore my new tab page to how I like it.

 /* Expand the shortcut icon images to max size on the Home/New Tab pages */
 .top-site-outer .tile .icon-wrapper {
   height:100% !important;
   width:100% !important;
 }
 /* Reduce vertical space between entries on pop-up menus */
 .top-site-outer {
   margin-block-end: -8px !important
 }

Modified by bsolj

Helpful?

Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.