How to Change the Color of an Address Bar

Written by ruri ranbe
  • Share
  • Tweet
  • Share
  • Pin
  • Email
How to Change the Color of an Address Bar
Modify Windows' appearance or edit userChrome.css to change the colour of the address bar in Firefox. (adress bar image by Wiktor Osiecki from

Popular browsers, such as Mozilla Firefox and Internet Explorer, allow you to apply custom skins to the browser's interface. To fully customise your Web browser, you can also change the colour of the address bar to match the skin. rnrnWhile you must edit Windows' display properties to modify the colour of the address bar in Internet Explorer, to change the colour of the address bar in Mozilla Firefox, you need only add a special code to the userChrome.css file.

Skill level:

Other People Are Reading


  1. 1

    Exit Firefox. Press "Ctrl"+"E" to open Windows Explorer. Type into the address bar "C:\Documents and Settings\<user>\Application Data\Mozilla\Firefox\Profiles\<profile>\chrome". Replace "<user>" with your Windows account name. Replace <profile> with the name of your Firefox profile. Hit "Enter."

  2. 2

    Right-click "userChrome-example.css." Click "Rename." Delete the "example" portion of the file name.

  3. 3

    Right-click "userChrome.css" and point to "Open With." Select "Notepad" from the list of options.

  4. 4

    Paste into the bottom of the document the following text: "#urlbar { background-colour: #<bgcolor> !important; colour: #<textcolor> !important; }". Replace "<bgcolor>" with the hexadecimal code of your desired background colour, and replace "<textcolor>" with the hexadecimal code of your desire font colour. Enter "FFFFFF" for white, "000000" for black, "FF0000" for red, "0000FF" for blue, "FFFF00" for yellow, "00FF00" for green, "FF7F00" for orange or "FF00FF" for magenta.

  5. 5

    Click "File," then "Save." Launch Firefox to view the modified address bar.

  1. 1

    Right-click the desktop. Select "Properties" from the pop-up menu. Click the "Appearance" tab, then click "Advanced."

  2. 2

    Select "Window" from the drop-down menu labelled "Item." Select a new colour from the available palette, or click "Other" to access a wider range of colours.

  3. 3

    Click "OK." Click "OK" again to change your address bar's appearance.

Tips and warnings

  • To change the colour of the address bar in Safari or Google Chrome, follow the directions as indicated for Internet Explorer.
  • Modifying the "Window" colour will effect other parts of the operating system's graphical user interface, along with the address bar.

Don't Miss

  • All types
  • Articles
  • Slideshows
  • Videos
  • Most relevant
  • Most popular
  • Most recent

No articles available

No slideshows available

No videos available

By using the site, you consent to the use of cookies. For more information, please see our Cookie policy.