Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/datguypiko/Firefox-Mod-Blur

Firefox Theme - For dark theme lovers / More compact / Modular / Blur
https://github.com/datguypiko/Firefox-Mod-Blur

blur css firefox firefox-linux firefox-mod-blur firefox-modification firefox-style firefox-template firefox-theme firefox-windows firefoxcss modification proton theme userchrome userchromecss windows10 windows11

Last synced: about 1 month ago
JSON representation

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

Awesome Lists containing this project

README

        


Firefox Mod Blur - Modular


Version
Updated Date
Created


Installation Guide
Extra mods
Download Latest

FirefoxCss


:wrench: Version 3.0 - Working on functionality overhaul. Responsive oneliner, toggling extra mods through about:config and other adjustments.(some time in the future, when I have time to finish it)

Preview v 3.0 https://github.com/datguypiko/Firefox-Mod-Blur/issues/129

## macOS style buttons

FirefoxCss

## Light and Dark theme support

FirefoxCss

## Updated context menu design

FirefoxCss

## Clean compact search with hidden buttons

FirefoxCss

## Show if pinned on hover

FirefoxCss

## More compact and responsive homepage

FirefoxCss

## Wallpaper style themes

style_1-wallpaper-edition.css


FirefoxCss

style_2-wallpaper-edition.css


FirefoxCss

style_3-wallpaper-edition.css


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.css

FirefoxCss

Search bar modifications :gear:
no_search_engines_in_url_bar.css

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

Icon changes :gear:
firefox_view_icon_change.css

FirefoxCss


white_github_icon_in_bookmarks.css

FirefoxCss


ublock-icon-change.css

FirefoxCss

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

Circular homepage shortcuts :gear:

circular_homepage_shortcuts.css


FirefoxCss

Spill style theme :hammer:

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


FirefoxCss


FirefoxCss

Acrylic MicaForEveryone :hammer:

acrylic_micaforeveryone.css


FirefoxCss

###### and [more](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS)..

: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](https://github.com/datguypiko/Firefox-Mod-Blur/releases/latest).
> ##### 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).
>
> 1. Website appearance (changes new tab and websites colors)
> ![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/a5f6726e-6bc0-4237-a770-b60ffb144c95)
> 2. Theme (changes toolbar and browser text colors, also sets text colors to new tab page).
> ![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/76ddf071-7a20-46fa-a029-fc28f96862a9)
>
> I use firefox integrated Flexible space for spacing:
>
> ![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/8598344a-dbf6-456e-bdd3-b5abe5a8abcd)
>

: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]
> ##### -------
> ##### Native Mica transparency is coming to firefox soon so this will 1. not be required or 2. can be used for better blur effect.
> ##### -------
> ##### 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 are able 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. I recommend using my older version files. [Maybe something like v115.x - v117.x should work fine.](https://github.com/datguypiko/Firefox-Mod-Blur/releases).

1. Download the portable or installation file from [github.com/MicaForEveryone](https://github.com/MicaForEveryone/MicaForEveryone/releases).
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.

:shield: Last Updates

GitHub last commit GitHub issues

`v2.7.4` - `22/12/2023` - Tested on Firefox v121.0
- Fix Linux context menu buttons (recent).
![292553441-2d194c5d-56ad-477e-9a1e-997dcf70f539](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/df88c39d-2a3f-41fb-8a34-3406d95d7006)
- Context menu back and forward buttons now dimmed when not active (recent).

`v2.7.3` - `22/12/2023` - Tested on Firefox v121.0
- Fix min/max/close buttons for Firefox beta, nightly (recent).
- Fix buttons size in context menu. Issue since Firefox v121 update (recent).
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/d1202c22-f157-4682-9393-d65988faacf9)
- Change/fix background color of active search link (recent).
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/e307408d-58c7-48cc-9c57-ee390dda0c1a)
- Updated "icons_in_main_menu.css" mod (Nov 2, 2023).
- Remove/Fix border from "Spill Theme" mod (fixed on Nov 19, 2023).
- Added support for "privacy_change_email_text.css" mod to work with Icons in main menu (Dec 4, 2023).

`v2.7.2` - `24/10/2023` - Tested on Firefox v119.0
- Fix Tabs Background color for Firefox v119.0 update.
- New extra mod added - [show_searchbar_dots_only_on_hover.css](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Search%20Bar%20Mods/Search%20box%20-%20dots%20show%20only%20on%20hover).
![preview](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/648256b8-f471-4ae1-9582-7fad782bac21)
- Search box Dots position fix when translation button is active.
- Extra Mods folder restructure.

`v2.7.1` - `07/09/2023` - Tested on Firefox v117.0
- Made Back and Forward icons a bit smaller to be more inline with other buttons.
- New extra mod added - [align search text to the left side](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Search%20text%20aligned%20left%20side) `searchbox_text_align_left.css`.
- New extra mod added - [tabs take full bar width](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Full%20Width%20Tabs) `tabs_take_full_bar_width.css`.
![preview](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/6d115b38-6ed8-40af-bb48-c1ec67392012)

`v2.7` `30/08/2023` Tested on Firefox v117.0.0
- Fix button icon colors for Firefox v117.x
- Fix window control buttons positioning for Firefox v117.x
- Added [new extra modification file](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Tabs%20Separator) `Tabs Separator`. Can be used with transparent tabs background mod.

![Screenshot 2023-08-30 014146](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/a289f5af-8dd9-4a1c-96c5-643493864425)

![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/6d51d37a-5739-4e17-a4d5-e03cba87970b)

- MicaForEveryone no longer works with Firefox v117 and above. [Read for more information](https://github.com/datguypiko/Firefox-Mod-Blur#wrench-micaforeveryone-installation).
- Color changes to Customize Toolbar window:

![firefox_2F08gSeXJY](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/9d331d53-73f1-4a7b-817e-63fbb54644de)

`v2.6.6` `19/08/2023` Tested on Firefox v116.0.3
- Some minor changes to tabs. Disabled selected tab width increase in specific condition because of weird transition animation. Still works in overflow and normally when tabs aren't taking full toolbar.
- Updated the [static tab extra mod](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Tabs%20-%20selected%20tabs%20static%20width) `selected_tabs_static_width.css` to work with latest changes.

`v2.6.5` `13/08/2023` Tested on Firefox v116.0.2
- Context menu fixes for Linux white theme.
- Fix context menu duplicated separators for Linux.

`v2.6.4` `07/08/2023` Tested on Firefox v116.0.1
- Selected tabs increase width by default now (use static mod file to disable it).
![preview](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/38af3b0c-cf10-4781-aa95-c116cbf8b8a1)
- Added new modification file `transparent_tabs_bg_color.css`.
![previezzw](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/ff76f9cb-ec42-4396-8d41-a04276c7f1cc)
- Added new modification file `reversed_tabs_bg_color.css`.
![previesw](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/62535301-fcf3-4164-a041-4beab30dd4b6)
- Added new modification file `selected_tabs_static_width.css`.
![preview](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/ff016655-e95f-4d59-8800-9fa43dc7c7d8)
- Shadow for tabs now showed correctly.
- Change tab color for micaforeveryone theme.

### Tested on Firefox v116.0.1
`v2.6.3` `07/08/2023`
- Fix context menu for firefox v116.x
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/c7f0ccf1-a210-4c69-927e-06bc158f1dba)

`v2.6.2` `06/08/2023`
- Show security button in URL box correctly when website isn't secure.
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/6e27b833-3893-483b-813a-852981d8f737)
- Sidebar background color change.
- Fix space between pinned tabs and non-pinned tabs for Firefox 116.x
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/7e3885e4-0ee7-4669-894e-1ced05a4be0d)
- Add support for extra mod file "[pinned_tabs_no_bg_color.css](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Pinned%20Tabs%20Have%20no%20background%20color)". No copy pasting code required anymore.
- Keyboard navigation fixes when selecting shortcuts in new-tab/homepage.

### Tested on Firefox v115.0.2
`v2.6.1` `28/07/2023`
- Change search bar border on Light Theme.
- Fix New Tab (home) page colors for Light Wallpaper Style Theme.
- Fix Breakout search from moving up when opened.

`v2.6` `27/07/2023`
- Added extra mod file to change menu icon to firefox logo. [menu_icon_change_to_firefox.css](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Icon%20mods).
- Permission Notification icon in url bar now showed correctly and isnt hidden until you block or allow specified permissions.
- Light theme support added. Read installation how to toggle between dark and light.

- Added Light theme support to MicaForEveryone theme.

- Search, Menu and Private window button icon changed.
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/ad3cd128-1ad8-4e1b-9bde-d7c8ecc03a4d)![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/d80e1a59-fae5-42a3-b123-345bd5331855)![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/70c7c92f-5334-4c72-b845-9e2ded0b6dc5)

### Tested on Firefox v115.0.1
`v2.5.1` `13/07/2023`
- Fix Search Bar dots positioning on linux.
- Changed design of dots specifically for linux.
- Changed opening animation of url bar buttons.
- Some code clean up and restructure.

### Tested on Firefox v115.0.1
`v2.5` `11/07/2023`
- CTRL+F Search bar color changes.
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/3d08dde7-5125-4845-b0ce-3b58e03b1292)
- Bottom left URL status panel color and border radius changes.
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/a819633e-3bcc-4d56-8d1c-7d23cf014098)
- Decreased pinned tabs Padding.
- Added new mod to remove background color from pinned tabs.
![image](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/04b6bc22-672c-41d8-ac87-f0cfd96b9c95)

- Revamped URL search bar buttons behavior.
-- All buttons are now hidden.
-- Added dots for visual representation. Left on by default for touch screen devices, have no way to test it.
-- Changed animations for how buttons close.
-- Hidden on new tab/homepage.
-- Almost all Permissions are hidden by default visually. Just Press on permissions button to show blocked and allowed ones.
-- Now less space wasted and more compact with long links and when resizing window.
-- Will add extra modification later that makes dots hidden until search bar is hovered.
![Screenshot 2023-07-11 224030](https://github.com/datguypiko/Firefox-Mod-Blur/assets/61329159/42a46566-1252-46df-996e-3a432592044b)

`08/07/2023` `-` `v2.4.3` `Firefox v115.0.1`
- New firefox update broke extensions menu again. Fixed padding and size for both extra mod styles.
Only need to replace the cleaner_extensions_menu.css file if you are using the extra modification.

`06/06/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](https://github.com/datguypiko/Firefox-Mod-Blur/tree/master/EXTRA%20MODS/Min-max-close%20window%20buttons) 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".

: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/`](https://www.reddit.com/r/FirefoxCSS/comments/ddi4dc/testing_the_backdropfilter_in_the_url_dropdown/)

> icons_in_main_menu.css (source)