Here we are showing some list of useful chrome developer tools which can be helpful specially for web developers or web designers. You can download these extensions on chrome website.
List of Useful Chrome Developer Tools
Redux DevTools
Redux DevTools for debugging application’s state changes. The extension provides power-ups for your Redux development workflow. Apart from Redux, it can be used with any other architectures which handle the state.
ModHeader
Add, modify, and remove request and response headers. Use ModHeader to set X-Forwarded-For, Authorization, Access-Control-Allow-Origin, etc. Modify cookies in request / response header. Redirect URL with another.
Checkbot: SEO, Web Speed & Security Tester
Checkbot is a powerful website testing tool that tells you how to improve the SEO, page speed and security of your website. Test SEO/speed/security of 100s of pages in a click! Check broken links, HTML/JavaScript/CSS, URL redirects, duplicate titles.
Visual CSS Editor
The extension allows you to customize any website without coding. Click on an element and start visual editing. Adjust colors, fonts, sizes, positions, and a lot more. Take full control over your website’s design with more than 60 style properties.
Lipsum Generator
Generate lorem ipsum dummy text.
CSS Selector Capture Pro
Generate a copiable CSS Selector with a mouseover without Devtool
ColorZilla
Advanced Eyedropper, Color Picker, Gradient Generator and other colorful goodies.
Window Resizer
This extension re-sizes the browser’s window in order to emulate various resolutions. It is particularly useful for web designers and developers by helping them test their layouts on different browser resolutions.
Dimensions
A tool for designers to measure screen dimensions. This extension measures the dimensions from your mouse pointer up/down and left/right until it hits a border. So if you want to measure distances between elements on a website this is perfect.
GitHub Web IDE
Open GitHub repositories in online web IDE. This extension adds to any GitHub repository a new drop down menu which offers links to a number of online services that allow viewing the source code of the repository in an IDE like interface.
Fix translation
Control Google Translate areas, customize translation or non-translation areas. Google Translate usually translates all content, but sometimes parts of the content do not need to be translated, such as: code, terminology, name, … etc.
React Developer Tools
Adds React debugging tools to the Chrome Developer Tools.
Recommended :
If you want more tutorials and tricks, then subscribe your email for all updates.
Follow us on Facebook, Twitter, Tumblr, LinkedIn
If you like this article then share this.