Top 4 Firefox add-ons for web designers

  • Posted on: 27 April 2011
  • By: Antti

There are hundreds of useful Firefox add-ons available but for web design and development these are the ones I use on a daily basis and just can't recommend enough.

1. Web Developer

If I could only choose one add-on it would be this. The Web Developer toolbar gives you a number of useful tools such as disabling JavaScript or CSS, display element information, ruler, resizing the window, validating your document, viewing the generated source and many more.

Web Developer toolbar

2. Firebug

Personally for me Firebug is great when things go wrong. Firebug lets you view and edit your HTML, CSS and JavaScript code in real-time.


3. ColorZilla

Quite simply with ColorZilla you can get a color reading in web format from any part of the website. Great little tool when doing mockups and theming work. Gone are the days of taking a print screen and pasting it to a graphics program to determine the color.


4. Screengrab!

After FireShot stopped being free I started using Screengrab! which lets you take screenshots of a webpage in a matter of seconds. Extremely useful when providing screenshots to the client of your development environment.



The Firefox add-ons mentioned here are all wildly popular among web designers and developers. I consider these to be on my essential list however they are only the tip of the iceberg from the wide range of useful add-on offering.

What's your must-have add-ons that boost productivity or ease everyday tasks?