Must Have Free tools for Web Developers

1. Light Shot – Screen capture tool

A must have tool for taking screen shot for active screen. This is a must have tool to share any specific issue/resolution with the team. The image can be saved as well as easily uploaded and a link can be shared.

Available as: a. Desktop application (preferred) 2. Chrome extension
Download tool

2. The Great Suspender

It is a light weight tool to save your high memory uses by Chrome. This tool suspends the tab which is inactive for a while. There are several setting options available to be customized as per the requirements.

Available as Chrome extenstion.
Download tool

3. Web Developer

It is an official tool by Firefox but is available as Chrome extension. It adds a toolbar to your browser with a lots of tools must have for a developer to streamline the tasks

Available as Chrome extension.
Download tool

4. Window Resizer

This tool helps in responsive development. This emulates the screen in various sizes and help in adjusting the codes to achieve a fully responsive design.

Available as Chrome extension.
Download tool

5. CSSViewer

This is simple tool originally by Firebox but available for Chrome.It shows the CSS of any element on a webpage.

Available as Chrome extension
Download tool

6. ColorZilla

It is an important tool for designers. It is a color picker, eye dropper and gradient generator. It also keeps a color history. It also has a web page color analyzer that give the color palette of any website.

Available as Chrome extension.
Download tool

7. Clear Cache

This tool clears cache with one click. The helps in making changes to a site where you require to clear cache again and again to see if changes are taking effect or not. There are several customization available as per your requirements.

Available as chrome extension
Download tool

8. PerfectPixel

It helps in developing pixel perfect web designs based on a provided design. It allows to overlay a transparent image on a site to match the design pixel by pixel. This helps developers to design the website exactly as per the model provided.

Available as chrome extension
Download tool

9. FontFace Ninja

This tool shows you which font is used on the website. It helps in inspecting, bookmarking and downloading the font. It also shows the font name, size, line spacing, letter spacing and color spacing of the font.

Available as chrome extension
Download tool

10. Page ruler Redux

It gives you the comfort of using a ruler on a web page while development to measure pixel dimension and positioning. You can check the width, height and position of any element on any website.

Available as chrome extension
Download tool

11. Lastpass

Last pass is a password storage service.It makes practicing good security a little easier, by letting you generate unique, random, very long passwords for each website you go to. If one website is compromised, attackers only have access to your account on that one website, and only until you change the password.

Available as chrome extension
Download tool

12. Wappalyzer

It detects content management systems, ecommerce platforms, web frameworks, server software, analytics tools and many more.

Available as chrome extension
Download tool

13. Pageload Time

It helps in measuring page load time and other relevant details.It has interactive UI with a pie chart and what we call Speed Icons

Available as chrome extension
Download tool

14. Google Tag Assistant

It is used to identify, validate and troubleshoot the installation of various Google tags on a web page.Just navigate to any page and Tag Assistant will tell you which tags are present,report any errors we find and suggest improvements that can be made to your implementation.

Available as chrome extension
Download tool

15. CSS Used

Get all css rules used by the selected DOM and its children.Used to extrac only the used CSS. So the unused css will be left out.If the selected DOM is the body, the result will be all the used css by the whole page curently.

Available as chrome extension
Download tool

16. Fireshot

The use FireShot to make everything much smoother. It gives you the possibility of capturing entire web pages or part of them directly from your web browser, without having to run a separate application.

Available as chrome extension
Download tool