This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Hierdie gesprek is in die argief. Vra asseblief 'n nuwe vraag as jy hulp nodig het.

How to cutom UI of Firefox dev console

  • 4 antwoorde
  • 2 hierdie probleem
  • 8 views
  • Laaste antwoord deur Mehdi

more options

Hi,

Is there any way to use custom style/css for Firefox dev console?

Thanks!

Hi, Is there any way to use custom style/css for Firefox dev console? Thanks!

Gewysig op deur Mehdi

All Replies (4)

more options

Hi, 1) Go to this url: chrome://browser/content/browser.xul This loads a page filled with Firefox GUI elements.

2) Open Tools-> Web Developer-> Inspector.

3) Inspect the element(s) you want to customize

4)Create a Stylish style that modifies those elements.

more options

evilssh said

Hi, 1) Go to this url: chrome://browser/content/browser.xul This loads a page filled with Firefox GUI elements. 2) Open Tools-> Web Developer-> Inspector. 3) Inspect the element(s) you want to customize 4)Create a Stylish style that modifies those elements.

Thanks, where I should put my custom CSS file? Also actually I need to customize Developer console, I could not open that in your mentioned URL. how I can open that too?

more options

right click inspect element the console is on the second tab.


you can visit this link for more info:

https://developer.mozilla.org/en-US/docs/Tools/Style_Editor

more options

evilssh said

right click inspect element the console is on the second tab. you can visit this link for more info: https://developer.mozilla.org/en-US/docs/Tools/Style_Editor

No, I know how to work with Dev console, (I'm web developer), I mean when I open your mentioned link, I can inspect (for example) toolbar items & change the CSS using Dev console. But the opened Dev console is for main window not for opened/editabled window.

I need to edit UI of Dev console not whole window (as I said in question title). (hope I could tell the point here)

Gewysig op deur Mehdi