The Best Google Chrome Extensions for Web Designers and Developers

The Best Google Chrome Extensions for Web Designers and Developers

Google Chrome is one of the most widely used web browsers, and thanks to its incredible Developer Tools console, is loved by web designers alike. Adding to and enhancing the already awesome user experience, Chrome’s web store offers a plethora of extensions that are designed to satisfy a multitude of uses.

From assisting with password storage to helping with video recording and much, much more, the Google Chrome web store is filled with plenty of handy, helpful and just plain awesome extensions.

To help you speed up your workflow, increase your levels of productivity and streamline your web design and development processes, we’ve shared a collection of our favorite Google Chrome Extensions.

Each of these extensions – listed in no particular order – can be found on the Google Webstore, and at the click of a button, they’ll be installed in your Chrome Browser. When you find an extension that you like, simply click the ‘Add to Chrome’ button and almost instantly, the extension will install. After installation, the extension will appear as a tiny icon in your Chrome browser, typically next to the URL field bar.

A word of advice, too many extensions can slow down your browsing experience so choose your extensions sparingly.

Loom

Google Chrome Extensions Loom

Incredibly easy to use, Loom allows its users to capture screencasts and create videos directly from the web browser. With full desktop recording that can include the front-facing camera too, Loom offers unlimited storage of video files, seeing an Embed HTML code allow the video to be shared anywhere. Videos can also be downloaded. Perfect for recording client demo videos or assisting in the support process, Loom videos allow for external interactions. Here, web clients or customer can engage directly with the video by commenting, adding reactions and more. Loom videos can also be stored within a nifty folder structure, making sure that your projects and associated videos are kept well organized.

 

Lorem Ipsum Generator

Google Chrome Extensions Lorem Ipsum Generator

Incredibly handy and convenient for designers across all disciplines, the Lorem Ipsum Generator generates dummy text at the click of a button. Users can specify how many paragraphs and words per paragraph are required and can simply copy and paste the generated dummy text into their mockups and design layouts.

 

Stylebot

Next up isStylebot. A handy tool for web designers, particularly those just starting out with scripting, Stylebot lets its users view and manipulate the CSS elements present on a website. Great for helping users learn and get comfortable with using CSS, Stylebot is also great for storing CSS scripting to be used during a web build. If you’d like to learn more about using Stylebot with Chrome, read our blog post, “How to Use Stylebot to Manipulate CSS on the Fly.”

 

Viewport Dimensions

Google Chrome Extensions Viewport Dimensions

Another tool that’s great for CSS scripting,Viewport Dimensions is a subtle but extremely helpful extension that unobtrusively displays the browser dimensions at the bottom of a browser window. When resigning the browser window, Viewport Dimensions will automatically show the screen size dimensions – a brilliant hack for testing the appearance of web elements at different breakpoints when writing @media queries.

Clear Cache

Google Chrome Extensions Clear Cache

One of the most useful extensions, Clear Cache lets the user clear their browser cache and data in a matter of seconds. As opposed to having to click through a million steps (i.e. through the browser’s History), the Clear Cache extension removes stored data at the click of a button. Adding an extra layer of awesome to this extension, users are also able to set what browsing data will be cleared when a hard refresh is executed. To preserve all of your history, passwords etc. but still refresh your browser, select the App Cache and Cache options under the Data to Remove menu.

LastPass

Google Chrome Extensions LastPass

Already a firm favorite among many, LastPass allows its users to keep track of your various accounts and their associated passwords. LastPass is particularly useful for users who manage various accounts (social, email etc.) on behalf of multiple clients or for users who only set strong passwords that are difficult to remember.

Awesome Screenshot

Google Chrome Extensions Awesome Screenshot

A great extension with many uses, Awesome Screenshot lets its users record videos, screencast, take screenshots of browser windows and capture full webpage images. Great for assisting clients or customers, Awesome Screenshot also allows for annotations, commenting and the blurring of sensitive information. A similar extension is Nimbus.

 

Window Resizer

Google Chrome Extensions Window Resizer

Great for assisting web designers with responsive design, the Window Resizer extension re-sizes the browser’s window to show the various resolutions of different screen sizes. A similar extension is Sizzy.

 

What Font

Google Chrome Extensions What Font

A simple and effective tool, What Font helps designers quickly and easily identify the font used on a webpage.

 

FaceBook Pixel Helper

Google Chrome Extensions Facebook Pixel Helper

A great tool for marketers that are is running Facebook ads, the FaceBook Pixel Helper assists by letting the user know if the Facebook tracking pixel is firing correctly on a certain page.

Fat Rank

Google Chrome Extensions Fat Rank

A fabulous SEO tool, Fat Rank is a keyword rank checker for websites. Great for checking competitor keyword activity as well as for offering insight to existing and potential clients, Fat Rank offers keyword information relating to a specific website, how the website ranks in Google and which relevant page URL is ranking.

 

The Great Suspender

Google Chrome Extensions The Great Suspender

Perfect for web designers and developers that keep hundreds of tabs open, The Great Suspender halts all activity of unused tabs to ensure that no unnecessary resources are being used up to run dormant pages.

 

Color Zilla

Google Chrome Extensions Color Zilla


Color Zilla
is a nifty Chrome extension that assists with the aesthetic site of web and graphic design. Great for designers of all disciplines, Color Zilla offers many features, such as reading the color from any point in a web page to being able to generate hex codes, generate gradients and plenty more. A similar extension is Color Picker.

 

We want to hear from you!

Do you use any Google Chrome Extensions? If so, which are your favorite? We’ll keep updating this post over time so if you have any particular favorites, let us know in the comments and we’ll add them to the list!

Thanks for reading!

Lisa-Robyn Keown

Lisa-Robyn is a qualified copywriter and brand strategist from Cape Town, South Africa.