Customize Firefox Developer dev tools color theme
Just as title says, I'd like to know if it's possible to change the color theme of Firefox Developer dev tools. Light and dark theme are nice, but I'd like to use a code color theme like Monokai or something similar, how can I do that?
Below you can see the current dark theme in the dev tools:
[![firefox dark theme screenshot [1]](https://i.sstatic.net/ZWyuj.jpg)
I found the answer to this in the Mozilla support forum and basically you have to modify the css style creating an overriding chrome stylesheet.
You would have to write your own style rules and apply them via userChrome.css or Stylish. Use the !important flag to override existing style rules.
https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity#The_!important_exception
The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.
- Bug count in Firefox releases
- JavaScript document.forms[0].field.value compatibility
- Override functions of the page in a Firefox extension content script
- Selenium using Python - Geckodriver executable needs to be in PATH
- ExtJs5 - overriding native method defined inside ext-all-debug.js
- Firefox not honoring hosts file
- SVG rect not showing up in firefox but works on chrome
- How do I query Firefox bookmarks by tag?
- How to detect Firefox mobile with javascript?
- How to access add-on content script in Firefox console?
- Firefox webextension Error: Could not establish connection. Receiving end does not exist
- In Firefox DevTools Network tab, how to see only failed requests?
- Why can't I get Firefox to play mp3 audio in one of my apps?
- jQuery find a li element within ul
- Glitchy Scroll Behavior on Mozilla Firefox Browser
- What are the differences between Firefox and Chrome in Javascript?
- insertBefore and appendChild in font awesome kit (version 5.15.4) causing csp issue only in Firefox Asp.Net Core
- in Firefox querySelector with attribute while finding path in svg gives error
- How to hide the url of the browser's left-bottom corner when a link is hovered
- How can I search all open tabs?
- How do you take a full webpage screenshot on a Windows computer?
- Android open link in Mozilla Firefox app in the current open tab
- Hide scroll bar, but while still being able to scroll
- How to disable paste protection in Mozilla Firefox Developer Console?
- Is there a way to make Firefox ignore invalid ssl-certificates?
- Issue with Backdrop blur on Chrome
- selenium.webdriver.Firefox not working properly on the login page of nbc.com
- Can't see network tab when trying to debug a shared worker on firefox for developers
- Passing large Data in Navigationextras in router.navigate Angular 16 causing Error in Firefox
- What causes NS_ERROR_STORAGE_CONSTRAINT in Firefox?