{"id":13473859,"url":"https://github.com/dexeonify/firefox-css","last_synced_at":"2025-03-26T19:34:54.708Z","repository":{"id":44758825,"uuid":"421863782","full_name":"dexeonify/firefox-css","owner":"dexeonify","description":"My CSS configuration to customise Firefox to my liking.","archived":false,"fork":false,"pushed_at":"2024-10-17T15:15:01.000Z","size":420,"stargazers_count":36,"open_issues_count":1,"forks_count":5,"subscribers_count":4,"default_branch":"main","last_synced_at":"2024-10-30T06:33:37.735Z","etag":null,"topics":["css","firefox","sidebery","startpage","userchrome"],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dexeonify.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-10-27T15:02:32.000Z","updated_at":"2024-10-18T05:29:05.000Z","dependencies_parsed_at":"2024-10-20T14:49:03.457Z","dependency_job_id":null,"html_url":"https://github.com/dexeonify/firefox-css","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dexeonify%2Ffirefox-css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dexeonify%2Ffirefox-css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dexeonify%2Ffirefox-css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dexeonify%2Ffirefox-css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dexeonify","download_url":"https://codeload.github.com/dexeonify/firefox-css/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245722990,"owners_count":20661860,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","firefox","sidebery","startpage","userchrome"],"created_at":"2024-07-31T16:01:07.537Z","updated_at":"2025-03-26T19:34:52.289Z","avatar_url":"https://github.com/dexeonify.png","language":"CSS","readme":"# firefox-css \u003c!-- omit in toc --\u003e\n\nSome `userChrome.css` configurations to customise Firefox to my liking.\n\nI'm currently daily-driving *Firefox Nightly*, so naturally I will try to\nupdate as soon as possible if there are any breaking changes.\n\n## Table of Contents \u003c!-- omit in toc --\u003e\n\n- [Features](#features)\n  - [Sidebery CSS](#sidebery-css)\n  - [URL bar blur](#url-bar-blur)\n  - [Rounded corner context menu highlight](#rounded-corner-context-menu-highlight)\n  - [Custom startpage using nightTab](#custom-startpage-using-nighttab)\n    - [Base Theme](#base-theme)\n    - [Nord Theme](#nord-theme)\n- [Usage](#usage)\n  - [userChrome.css](#userchromecss)\n  - [Smooth scrolling](#smooth-scrolling)\n  - [Vertical tabs](#vertical-tabs)\n  - [Custom new tab](#custom-new-tab)\n- [References](#references)\n\n## Features\n\n### Sidebery CSS\n\n\u003chttps://user-images.githubusercontent.com/72267349/147921242-f2a5900d-1ef1-408a-b04e-a7c7440efb6a.mp4\u003e\n\n### URL bar blur\n\n![Blurred URL Bar](https://i.imgur.com/s5036st.png)\n\n⚠️ Blur currently **does not work** regardless of `layout.css.backdrop-filter.enabled`,\ndue to [bug 1773402](https://bugzilla.mozilla.org/show_bug.cgi?id=1773402).\n\n### Rounded corner context menu highlight\n\n![Rounded Corner Context Menu](https://user-images.githubusercontent.com/72267349/154794069-1ecf9605-c22c-4b83-bea0-593d1ffa7cf4.png)\n\n### Custom startpage using [nightTab](https://github.com/zombieFox/nightTab)\n\n#### Base Theme\n\n![nightTab](https://user-images.githubusercontent.com/72267349/147921209-55f18032-af83-4db2-9c7c-51c977096d27.jpg)\n\n#### Nord Theme\n\n![nightTab Nord](https://user-images.githubusercontent.com/72267349/147921152-0839d947-02c9-4b5c-a70c-5aafad09352b.jpg)\n\n## Usage\n\n### userChrome.css\n\n1. Go to `about:config` and enable `toolkit.legacyUserProfileCustomizations.stylesheets`\n2. Go to `about:support` and click **Profile folder \u003e Open Folder**.\n3. Create a new folder named `chrome`, download/clone this repo and copy the\n   downloaded files into the `chrome` folder you just created.\n4. Restart Firefox.\n\n\u003cdetails\u003e\n\u003csummary\u003eThe directory tree should look something like this:\u003c/summary\u003e\n\n```css\n\u003cyour profile folder\u003e\n│   user.js\n└── chrome/\n    │   userChrome.css\n    │   noise-512x512.png\n    │\n    └── components/\n            autohide_sidebar.css\n            hide_tabs_toolbar.css\n            rounded_corner_context_menu.css\n            windows_controls_placeholder.css\n```\n\n\u003c/details\u003e\n\n### Smooth scrolling\n\nCopy the `user.js` file (from the `misc/` folder) to the **Profile folder**\n*(not the `chrome/` folder)*. Remove other unrelated tweaks, if needed.\nThe `user.js` file can be deleted afterwards.\n\n### Vertical tabs\n\n0. Install [Sidebery](https://addons.mozilla.org/firefox/addon/sidebery).\n1. Copy the contents of `misc/sidebery.css`.\n2. Navigate to **Sidebery Settings \u003e Styles editor** and paste the CSS under\n   \"Sidebar\" on the right.\n3. Individually set the following options in Styles editor:\n   - **Background color** to `#2B2A33`\n   - **Info color** to `#9494AA`\n   - **Color of active option** to `#9494AA`\n   - **Color of inactive option** to `#52525E`\n   - Under \"Context Menu\", **Background color** to `#2B2A33`\n   - Under \"Context Menu\", **Option background color on hover** to `#2B2A33`\n4. Set window preface value in **Sidebery settings \u003e Help \u003e Preface value**\n   to \" \" (a space).\\\n   **Note:** The preface value can be anything, but you would have to change it\n   accordingly inside the `userChrome.css` files as well.\n5. Alternatively, import `misc/sidebery-data.json` in **Sidebery Settings \u003e Help \u003e Import**,\n   if you are fine with my settings. :P\n\n### Custom new tab\n\n0. Install [nightTab](https://addons.mozilla.org/firefox/addon/nighttab).\n1. Open a new tab and click the settings icon.\n2. Navigate to **Data \u003e Restore \u003e Import from File**.\n3. Import any of the any of the `nightTab*.json` file.\n4. To set nightTab as your default homepage, [see here](https://github.com/zombieFox/nightTab/wiki/Setting-nightTab-as-your-Firefox-homepage).\n\n## References\n\n- [MrOtherGuy/firefox-csshacks](https://github.com/MrOtherGuy/firefox-csshacks)\n  - [hide_tabs_toolbar_v2.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/hide_tabs_toolbar_v2.css)\n  - [autohide_sidebar.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/autohide_sidebar.css)\n  - [context_menus_more_proton.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/context_menus_more_proton.css)\n  - [iconized_content_context_menu.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/iconized_content_context_menu.css)\n  - [iconized_main_menu.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/iconized_main_menu.css)\n  - [iconized_places_context_menu.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/iconized_places_context_menu.css)\n  - [iconized_tabs_context_menu.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/iconized_tabs_context_menu.css)\n  - [iconized_textbox_context_menu.css](https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/iconized_textbox_context_menu.css)\n- [mgastonportillo/gale-for-ff](https://github.com/mgastonportillo/gale-for-ff)\n- [Redundakitties/colorful-minimalist](https://github.com/Redundakitties/colorful-minimalist)\n","funding_links":[],"categories":["CSS"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdexeonify%2Ffirefox-css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdexeonify%2Ffirefox-css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdexeonify%2Ffirefox-css/lists"}