README.md

June 17, 2026 · View on GitHub

Firefox Mod Blur - Modular

FirefoxCss

🔹 macOS style buttons

FirefoxCss

🔹 Light and Dark theme support

FirefoxCss

🔹 Clean compact search with hidden buttons

FirefoxCss

🔹 More compact and responsive homepage

FirefoxCss

Select and add extra styles and functions

Min-max-close buttons style :gear:

Select one min-max-close_buttons.css

Left side MacOS style

FirefoxCss

Right side MacOS style

FirefoxCss

Right side OS

FirefoxCss

Left side OS

FirefoxCss

Theme default

FirefoxCss

Bookmarks bar modifications :gear:

popout_bookmarks_bar_on_hover.css

FirefoxCss

remove_folder_icons_from_bookmarks.css

FirefoxCss

bookmarks_bar_same_color_as_toolbar.css

FirefoxCss

Transparent Bookmarks bar. Enable mod.transparent.bookmarks-bar or mod.transparent.bookmarks-bar.centered in about:config

FirefoxCss

Privacy mods :gear:

privacy_blur_email_in_main_menu.css

FirefoxCss

privacy_blur_email_in_sync_menu.css

FirefoxCss

privacy_blur_tabs_content.css

FirefoxCss

privacy_change_email_text.css

FirefoxCss

Extension menu changes :gear:

Style 1 - cleaner_extensions_menu.css

FirefoxCss

Style 2 - cleaner_extensions_menu.css

FirefoxCss

How to enable/disable extra functionality

In search bar type -> about:config

If it's configured using numbers select number else select boolean and press add -> +

To reset default values delete the added preference or set it to false (for boolean).

To find all added preferences search "mod."

Copy and Enable preferred modifications:

Preference name	Value	Notes
mod.number.of.extensions.in.a.row	1 to 10	Change number of extensions in one row. Default [4]
mod.extensions.menu.extention-icon.size	12 to 30	Change extensions icons size. Default [22]
mod.hide.manage-extensions.button	true	Hide the button that opens all extensions manager inside settings.
mod.disable.extensions-menu.separator	true	Hide sepatator between active and inactive/faded extensions. Only visible when there is at least one faded extension.
mod.hide.faded-extensions.inside.extensions-menu	true	Hide all faded/inactive non interactable extensions from extension menu. Not necessary if they aren't visible by default.

Icon changes :gear:

firefox_view_icon_change.css

FirefoxCss

white_github_icon_in_bookmarks.css

FirefoxCss

ublock-icon-change.css

FirefoxCss

More compact Vertical Tabs :gear:

Enable mod.compact.vertical.tabs in about:config

Centered Tabs :gear:

Enable mod.centered.tabs in about:config

Hide Tab preview panel :gear:

Enable firefoxcss.disable.tab.preview.panel.fully in about:config

Hide scrollbar when Vertical tabs overflow :gear:

Enable mod.disable.scrollbar.in.vertical.tabs in about:config

Enable Search Box focus outline :gear:

Enable mod.searchBox.focus.outline.enable in about:config

Tabs on top :gear:

Enable firefoxcss.tabs.on.top.enable in about:config. Doesn't work with custom window control buttons for now (linux should work)

Window Frame border mods :gear:

- Fully padded Window border: Enable mod.main.window.frame.style-1 or mod.main.window.frame.style-2 in about:config

Screenshot 2026-03-25 034441

- Default Window border and shadow: Disable mod.disable.browser.border-and-shadow in about:config

Screenshot 2026-03-25 031116

Always show Search Bar buttons :gear:

Enable mod.search.info.buttons.show.always in about:config

Active tab has static width :gear:

selected_tabs_static_width.css

FirefoxCss

Colored sound playing tab :gear:

colored_soundplaying_tab.css

FirefoxCss

Hide List all tabs button :gear:

hide_list-all-tabs_button.css [Shows when tabs overflow]

FirefoxCss

Restore icons in main menu :gear:

icons_in_main_menu.css (source)

FirefoxCss

Remove title text from homepage shortcuts :gear:

remove_homepage_shortcut_title_text.css

FirefoxCss

Center Widgets in New Tab :gear:

Enable mod.center.widgets or mod.center.widgets.keep.title-text in about:config

mod.center.widgets

mod.center.widgets.keep.title-text

Experimental: Popout Searchbar with Blur :gear:

Enable mod.popout.searchbar or mod.popout.searchbar.no-animation in about:config

preview7

Experimental: Extra Blur mods :gear:

- Combined extra Blur mod.combined.extra.blur, combines: "mod.panel-menu.blur", "mod.searchbar.blur" and "mod.vertical-tabs.expand.blur". Enable in about:config

- Searchbar Blur: Enable mod.searchbar.blur in about:config

- Panel menu Blur: Enable mod.panel-menu.blur in about:config

- Vertical Tabs expand Blur: Enable mod.vertical-tabs.expand.blur in about:config

607544747-cb47553b-bb5c-413a-b23c-c76060b68b95

Circular homepage shortcuts :gear:

circular_homepage_shortcuts.css

FirefoxCss

Wallpaper Blur in New tab page :hammer:

Enable mod.new-tab.background.blur using Number field in about:config
Type intensity number [1 to 10] - Default [4] is used when selecting Boolean field instead of Number

Screenshot 2026-06-04 233259

Preview

Spill style theme :hammer:

Enable mod.spill-theme in about:config

FirefoxCss

Card Style theme :hammer:

Enable mod.card-theme.style.1 or mod.card-theme.style.2 in about:config

Preview_Style2_Dark Preview_Style1_Dark Preview_Style2_Light Preview_Style1_Light

On Pause - Acrylic MicaForEveryone :hammer:

Will be updated when Firefox fully releases blur

FirefoxCss

:wrench: Installation

Important

1. In `about:config` set `toolkit.legacyUserProfileCustomizations.stylesheets` to "True" for your custom themes to work.

2. Download latest or your preferred firefox version .zip file.

3. You can find your profile folder by writing `about:support` in URL bar and using `Open folder` in `Profile folder` section.

4. Put `userChrome.css`, `userContent.css`, `ASSETS` in chrome folder (create `chrome` folder inside your main profile folder if it doesnt exist).

5. Put any selected extra `.css` modification files (not folders) from `EXTRA MODS` to inside of your `chrome` folder.

6. File Structure (required files/folders marked with *):

:open_file_folder: ... / your profile / chrome / userChrome.css *

:open_file_folder: ... / your profile / chrome / userContent.css *

:open_file_folder: ... / your profile / chrome / ASSETS * /

:open_file_folder: ... / your profile / chrome / [extra modification file].css

Tip

How to Toggle between Light and Dark theme:

There are two settings to change in firefox (pictures below).

Setting both to auto makes it adapt to your operating system theme.
Setting Theme(2) to Light or Dark will force it no matter of Operating System colors.
Best to leave Website Appearance(1) settings set to auto and just Change to preferred Theme(2).

Website appearance (changes new tab and websites colors)
Theme (changes toolbar and browser text colors, also sets text colors to new tab page).

I use firefox integrated Flexible space for spacing:

:wrench: Easy Installation Script by Alan-Kuan

Download https://github.com/Alan-Kuan/Firefox-Mod-Blur

Installation Instructions https://github.com/Alan-Kuan/Firefox-Mod-Blur#page_with_curl-installer-script

:wrench: MicaForEveryone Installation

Warning

Will be updated when firefox fully enables blur. No need to external programs.

Download the portable or installation file from github.com/MicaForEveryone.
Install the extra files it asks you to install. And run the program.
At the bottom left corner press Add Rule -> Add Process Rule, type firefox -> add.
On the left panel select and open firefox section. Change Mica to Acrylic for better blur effect.
Dont forget to download my css file acrylic_micaforeveryone.css from EXTRA THEMES and put it inside Chrome folder (and base files from Installation guide above).
Remove and dont use any other min-max-close window button files.
Expermental:warning: In MicaForEveryone settings firefox section enable Blur Behind so when the window is not active it will still be blurred.

:page_facing_up: Other

Old version files backup: https://github.com/datguypiko/Firefox-old-files-backup

:page_facing_up: Sources

Source for Backdrop filter: https://www.reddit.com/r/FirefoxCSS/comments/ddi4dc/testing_the_backdropfilter_in_the_url_dropdown/

icons_in_main_menu.css (source)