Every time I open a new tab in Firefox, I'm greeted with about:blank.  As far as creative names go, the name of this page is not very creative because it is just that - blank:



For most of us this isn't a big deal because we don't really spend much time staring at a new, open tab. However others may want to customize it. This article will teach you how to do just that.

To customize your about:blank page, you'll need a user-content.css file.  To make one, press the Windows key and R simultaneously.  A box titled "Run" will pop up.  In it, type %APPDATA%.  Then go to Mozilla\Firefox\Profiles. In that folder you should see a folder named something like [randomtext].[profilename]:



For most of us there should only be one folder like this. For others (who created multiple profiles) there will be multiple folders. If there are multiple folders, select the folder corresponding to the profile that you want to customize about:blank for.

Once you are in the [randomtext].[profilename]: folder, look for the chrome folder. In that folder, find userContent-example.css and rename it to userContent.css.

Next, open userContent.css in Notepad or any other text editor (Notepad is preferred over something like Word because it is more simple) add the following code to the end of the file:

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url("about:blank") {

* {
background: url('[INSERT IMAGE URL HERE]');
background-color: #000000;
background-position:center center;
background-attachment:fixed;
background-repeat:no-repeat;
}
}

Where it says [INSERT IMAGE URL HERE], put the URL of either an image from the web (Ex: http://www.google.com/logos/giroux1.gif) or the URL of an image on your computer (Ex: file://C:/Users/Public/Pictures/Sample Pictures/desert.jpg).

In addition to changing the background image, you can

  • Change the background color via the background-color field. Change the #000000 code to whatever color you want (be sure to leave the # for whatever new code you enter). The code is in hex for colors is RGB. To find a list of colors and their corresponding codes, visit Wikipedia.
  • Change the position of the background image (assuming you have it set to no-repeat otherwise the position is pointless) via the background-position field. Here is a list of what you can enter:

top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
 x% y%
 xpos ypos
inherit

After you have edited the settings as you please, save the file and restart Firefox (if you had it open). You should then see something like this every time you open a new tab: