Download Source Files
- Source files for this tutorial are available to Premium members.
Get a Premium Membership
Firebug is a Firefox extension that will streamline your developing process: it offers a plethora of tools for working with HTML, CSS, Javascript, and more. In this tutorial, I’m going to take you to a black belt level of Firebug usage that will karate chop your website woes! Become a Premium member today!
Join Tuts Plus

For those unfamiliar, the family of TUTS sites runs a premium membership service called “Premium”. For $9 per month, you gain access to exclusive premium tutorials, screencasts, and freebies at nettuts+, psdtuts+, and vectortuts+! For the price of a pizza, you’ll learn from some of the best minds in the business. Join today!
- Subscribe to the NETTUTS RSS Feed for more daily web development tuts and articles.







mmm interesting! i hope all plus member enjoy and learn with this tutorial!
Isn’t there a free sample version?
Let me know if/when it becomes free.
Should be a nice tut!
Dose any one know, if I register today as a plus member will I be able to access all the past plus tutorials?
Yes , u will get access to all past tutorials !
So , Don’t wait and get PLUS membership TODAY !
Yeah you get access to all current and past plus tutorials from NetTuts, PSDTuts, VectorTuts, and AudioTuts.
Woha! cool! I will register today!!
Thanks guys!
Ok …
I love firebug (:
twitter.com/sonergonul
friendfeed.com/sonergonul
Is this tutorial created using latest version?
Unfortunately, Firebug 1.4 was released the day I sent this to Nettuts. However, I do talk about a few 1.4 features. Really, everything is applicable to 1.4; the biggest change in the latest version is the UI.
If anything is going to entice me to sign upto the plus package, its not this. If you know your HTML/CSS/Javascript do you really need a tutorial telling you how to use firebug? I use it all the time, and picked it up instantly.
I do however want to sign up to this at some point, the photoshop to wordpress tutorial looks very interesting.
Firebug is awesome! I consider it a necessity for web development.
Thanks for the tut.
Meh, so irritating to have unavailable tuts pop up in my RSS reader…
Thankfully they put ‘New Plus Tutorial’ in the title so you don’t need to click the link if you don’t want…
This is the best tutorial on nettuts so far! Detailed, very clear explanation.
And most important for some of us with slow internet connections … a small download size. [I cannot download most of the plus tuts because of time-outs].
http://getfirebug.com/docs.html
it’s good and everything but I dont think this should be a plus tutorial.
Wish that there was a more comprehensive description of what is being covered. There are hundreds of tuts on this subject all across the web.
I’ve tried to cover the whole spectrum; I review every part of Firebug, what it can do, and how you can use it. Hope this helps!
Are any book out on firebug? I can’t find any
This is a AWSOME tut, i will def try, who needs uni when we have you!!!
Very cool! I didn’t realize that I was only about a yellow belt. Gotta read the rest of this when I get time. There’s a lot to digest.
I hope you guys mention the new Off button interface change in the 1.4 release. It really through me for a loop when I realized I was deactivating Firebug (disabling Network profiling and the console) instead of simply minimizing it.
http://www.russellheimlich.com/blog/firebug-gets-a-little-buggy/
orange belt:
console.Endgroup() must be console.groupEnd()