xuedongliu/firefox-mod-blur

Firefox Theme - For dark theme lovers / More compact / Modular / Blur

Firefox Mod Blur - Modular

macOS style buttons

Light and Dark theme support

Updated context menu design

Clean compact search with hidden buttons

Show if pinned on hover

More compact and responsive homepage

Wallpaper style themes

style_1-wallpaper-edition.css

style_2-wallpaper-edition.css

style_3-wallpaper-edition.css

Select and add extra styles and functions

Min-max-close buttons style ⚙️

Select one min-max-close_buttons.css

Left side MacOS style

Right side MacOS style

Right side OS

Left side OS

Theme default

Bookmarks bar modifications ⚙️

popout_bookmarks_bar_on_hover.css

remove_folder_icons_from_bookmarks.css

bookmarks_bar_same_color_as_toolbar.css

transparent_bookmarks_bar.css

Search bar modifications ⚙️

no_search_engines_in_url_bar.css

Privacy mods ⚙️

privacy_blur_email_in_main_menu.css

privacy_blur_email_in_sync_menu.css

privacy_blur_tabs_content.css

privacy_change_email_text.css

Extension menu changes ⚙️

Style 1 - cleaner_extensions_menu.css

Style 2 - cleaner_extensions_menu.css

Icon changes ⚙️

firefox_view_icon_change.css

white_github_icon_in_bookmarks.css

ublock-icon-change.css

Active tab has static width ⚙️

selected_tabs_static_width.css

Colored sound playing tab ⚙️

colored_soundplaying_tab.css

Hide List all tabs button ⚙️

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

Restore icons in main menu ⚙️

icons_in_main_menu.css (source)

Remove title text from homepage shortcuts ⚙️

remove_homepage_shortcut_title_text.css

Circular homepage shortcuts ⚙️

circular_homepage_shortcuts.css

Spill style theme 🔨

spill-style-part1-file.css and spill-style-part2-file.css

Acrylic MicaForEveryone 🔨

acrylic_micaforeveryone.css

🔧 Installation

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 to Light or Dark will force it no matter of Operating System colors.
• Best to leave Website Appearance settings set to auto and just Change to preferred Theme.

1. Website appearance (changes new tab and websites colors)

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

I use firefox integrated Flexible space for spacing ^{[show image]}

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, image 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 inside your chrome folder.

6. File Structure:

   📂 ... / your profile / chrome / userChrome.css

   📂 ... / your profile / chrome / userContent.css

   📂 ... / your profile / chrome / image /

   📂 ... / your profile / chrome / [extra modification file].css

   📂 ... / your profile / chrome / wallpaper / (for wallpaper theme)

🔧 MicaForEveryone Installation

❗❗❗ DEPRECATED WITH FIREFOX v117 and up ❗❗❗

To continue using MicaForEveryone you can use Firefox v115 ESR - Extended Support Release version which will be supported and have security updates for at least a year. You can install ESR version to separate folder so you can continue using both versions. I haven't tested that version so there could be some minor issues. https://www.mozilla.org/en-US/firefox/all/#product-desktop-esr

1. Download the portable or installation file from github.com/MicaForEveryone.
2. Install the extra files it asks you to install. And run the program.
3. At the bottom left corner press Add Rule -> Add Process Rule, type firefox -> add.
4. On the left panel select and open firefox section. Change Mica to Acrylic for better blur effect.
5. 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).
6. Remove and dont use any other min-max-close window button files.
7. Expermental:warning: In MicaForEveryone settings firefox section enable Blur Behind so when the window is not active it will still be blurred.

🛡️ Last Updates

06/60/2023 - v2.4.2 Firefox v114.0

• New update changed extension menu. Fix icon positioning for style 2 "cleaner_extensions_menu.css" extra mod.

22/05/2023 - v2.4.1 Firefox v113.x

• Linux tested on Fedora GNOME and Mint Cinnamon.
• Fixes on linux for context menus.
• Fixes on linux for control buttons. Still need to manually change distance depending on how many buttons there are --firefoxcss-control-buttons-margin on line 44 in userChrome.css
• Linux fixes for Min-max-close window buttons extra mods. Still need to manually change distance depending on how many buttons there are --firefoxcss-control-buttons-margin on line 44 in userChrome.css.

09/05/2023 - v2.4 Firefox v113.x

• Fixed positioning of elements after some "-moz" attributes no longer used by firefox from v113.x.
• When moving with tab or arrows in search now shows hover background color correctly.
• Changed default min-max-close window control buttons to be on the right side. Lowered padding between buttons. Fixed order in v113.x.
• Fixed Window control buttons increasing height of tab bar when firefox window made smaller. Was only the problem with default buttons.
• Added an option for window controls mods to have menu bottons on the right or on the left side.
• Fix separator color in context menu.
• "Cleaner extension menu" mod fixes. It automatically adjusts the width if number of extensions below the number of icons set in a row which default is 3.
• Top toolbar more compact with height lowered by 4 pixels.
• Other minor changes.

01/04/2023 - v2.3.2 Firefox v111.x

• Fixed "clean extension menu" mod so there is no empty space anymore no matter of how many extensions you have set in a row. If you have less than the number set (default 3) the width will adjust automatically. Now the default file doesnt have the separator line anymore.

26/03/2023 - v2.3.1 Firefox v111.x

• Fixed and Reworked extension menu to use grid instead of flexbox, no width change required anymore. Now change "--firefoxcss-number-of-extensions-in-a-row" value to wanted extensions icon count in a row.

25/03/2023 - v2.3 Firefox v111.x

• When moving with tab or arrows in search now shows hover background color correctly.
• Fix separator color in context menu for v111.x

20/01/2023 - v2.3 Added extensions menu modifications for firefox v109.0.0; Merged some code lines and renamed extensions for cleaner code.

14/12/2022 - v2.2.1 Fix url bar icon size for firefox v108.0.0

08/12/2022 - v2.2

• Circular homepage shortcuts - extra mod.

• Give more width to active tab - extra mod.

• Autohide tab and bookmarks bars - extra mod.

• Search bar no border - extra mod.

• Search bar transparent background - extra mod.

• Fix padding for homepage shortcuts in wallpaper theme using no text mod.

29/11/2022 - v2.1 Added wallpaper style themes with 3 choices. Fixed Tab closing glitch. Fixeed spilled theme wallpaper file wrong destination folder. Fixed micaForEveryone support for Firefox Nightly after new update. Changed colors of sound/audio button in tabs. Other few minor fixes.

26/11/2022 - v2.0 Reworked theme files, structure and added new things with more options.

20/07/2022 - Changed wallpaper on a blank loading screen to a solid dark color for the "userContent-WallpaperEdition".

19/07/2022 - Added new theme with background wallpaper and blur effect.

10/06/2022 - Fixed padding in fullscreen after recent version changes.

14/05/2022 - Fixed after an update broken popup menu background color for 100.x versions of firefox.

13/02/2022 - Added new optional file for default size scrollbar. The color stays dark. Works best with new Windows 11 scrollbar. Use "userContent-Windows11_DefaultSizeScrollbar.css" file and rename it to "userContent.css".

📄 Other

Last Tested on:
	New 2.0 theme for Proton
		-- Windows 10/11 - 116 / 115 / 114.0 / 113.0.1 / 112.x / 111.0.1 / 110.0.0 / 109.0.1 / 109.0.0 / 108.0.0 / 107.0.0 / 106.0.1
		-- Fedora GNOME - 113.0
		-- Mint Cinnamon - 113.0
	
	Older PROTON theme
		-- Windows 10/11 - 106.0.1 / 105 / 104.0.1 / 102.0.1 / 102.0 / 101.0 / 100.0 / 99.0.1/ 98.0 / 97.0.1 / 96.0.3 / 96.0 / 95.0 / 94.0.1 / 93.0 / 91.0.2 / 90.0.1 / 90.0 / 89.0.1 / 89.0.0 

	Old Firefox Versions:
		-- Windows - 73.0.1 / 74.0 / 74.0.1 / 75.0.0 / 77.0.1 / 80.0 /  84.0.1 / 85.0.0
 		-- Linux - 74.0.1 | Default Dark Theme

📄 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)