URL Bar Tweaks - Remove Visit/Search & Limit Width – userChrome.css Style Builder

Firefox 75: Megabar – Configuring and Styling the Firefox 75 Address Bar

The "Show CSS Code" feature on userstyles.org doesn't update to reflect your settings. While that is broken, you can use this page to select your options and generate CSS you can copy/paste into a userChrome.css file. For more information on creating a userChrome.css file, see: How to Create a userChrome.css File.

May 6, 2018: Currently, userstyles.org no longer allows seamless background retrieval of styles saved there, so until this page is rebuilt, you will need to add a step to get the generated code (see buttons/links below the options).

July 8, 2019: Firefox 68 support in progress. Note: do not declare the XUL namespace with this style code. You might prefer to use @import. See: https://www.userchrome.org/adding-style-recipes-userchrome-css.html.

Select a Drop-down Style and Configure Style-Specific Options

BROKEN IN FIREFOX 72!

Width:

Width:

Width:

N/A

Title and URL font size:

Top/Bottom Position and Font Size:

Title and URL font size


URL/Title Allocation:


Leave space on the right for tags/switch to tab?

N/A

Configure Other Style Options

All Versions/StylesFor the Firefox 48+ Styles

Hide the Visit / Search top row ?


Rows visible on drop-down without scrolling:

To generate more suggestions: Increase the value for browser.urlbar.maxRichResults on the about:config page.

Restore persistent display of the drop-marker icon ?

Got Quantum (Photon UI refresh)?


Colors for Selected/Active Item or Dark Theme:


Custom background/highlight color (hex code):


Custom title, url, and action color


Matched text styling:

Highlight Color and Match style:

Dark Theme:

CSS based on above options:

CSS to be shown here

Copyright © 2019 Jefferson Scher (BSD-3-Clause License or CC-BY License). FileSaver.js © 2016 Eli Grey (MIT License).