The best Chrome extensions for Front-end web developers

Posted:

Chrome’s built-in Dev Tools provide a wide range of tools to help build and debug issues with the HTML, CSS, JS etc. But for productive web development there’s about 10 extensions that I use a lot.

CodeCopy

Link

CodeCopy

Useful little time-saver. This adds clipboard.js to Stack Overflow, GitHub, Gist, MDN, Medium, NPM and more. See a snippet of code you want to copy? No need to select the text manually, just click the button to copy to the clipboard.

ColorZilla

Link

ColorZilla

Adds a colour picker tool. Great for matching CSS values to bitmap images etc.

Google Analytics Opt-out Add-on (by Google)

Link

Google Analytics

This is great for instantly blocking your own visits to sites from appearing in your sites traffic. Note: also available for nearly all other major browsers.

Image Size Info

Link

Image Size Info

Right-click on an image to get the file size info. It also displays the original and displayed dimensions.

Lighthouse

Link

lighthouse

Google’s performance, accessability, SEO and best practises plugin is now built directly in to Chrome Dev tools, but the extension on the store is a slightly newer version (2.7.0 at time of writing) with a few more audits. The team are continually working on improving this with monthly updates. Essential - don’t launch a new site without testing with this.

Link

Link Checker

Scan the current page for broken links.

Pesticide for Chrome

Link

Pesticide for Chrome

I use this everyday. Super helpful for working out CSS issues with padding and margins.

Web Developer

Link

Web Developer

I’ve used this extension for what must be about 15 years. Packed full of useful tools, many of which are unavailable in Chromes dev tools. I often miss the persistent toolbar which was present in an earlier version of the Firefox plugin though.

Checkbot

Link

[checkbot

A fantastic service which scans your site for SEO, web speed and security checks.

Multi-Browser Screenshots

Link

Web Developer

An extension I created for quickly testing webpages across a selection of common browsers and devices, including IE 8/9/10/11, Nexus 6, Nexus 9, iPad Air (iOS 8.3) and more.

Updated:

Comments

Leave a Comment

Your email address will not be published. Required fields are marked *

Loading...