4 Great Firefox Extensions for CSS and Web Design

If you're designing sites and are a Firefox user, take a look at these extensions that can help you get the job done.


Firebug is an extension that legs you monitor your code. You can debug your CSS, your HTML and your JavaScript on the fly, allowing you to get information about what's working great and what needs a bit of tweaking. The best thing about this extension is that you can do that tweaking right from the extension; it allows full editing capability and does a nice job of color coding your lines.

Grease Monkey

Grease Monkey lets you test out your scripts on live pages. When the page loads, it applies whatever JavaScript you want to the page, allowing you to check out the end effects of your code. This is a popular one with security enthusiasts, for obvious reasons.


FireShot doesn't handle code but it's a great design tool. It allows you to take screen shots and to add notes to them and to plug graphics into the captures, as well. Designers that want to snatch a page capture and do some alterations will find this to be very handy. This is a hugely popular extension, with well over 100,000 users actively employing it on their browsers.

CSS Validator/HTML Validator

This is a very useful tool, no matter how advanced your coding skills may be. This validator takes it right to the source, using the W3C CSS validator for any web page you use it on. It's activated through the right click menu. Best of all, you can either read the results on the status bar or, if you need more detailed analysis of your code, you can take a look at the source with more specific information about what's wrong and right about it.