Top 8 Chrome Extensions for Designers

April 5, 2016 by Daizy Jain

When it comes to designing websites, Chrome extensions can make your life a little easier.

From selecting which font to use for a website to accessing the images from a web page; you name it, and there will be a Chrome extension for it. We’ve scoured the extensive list of Chrome extensions and hand-picked a few that we thought might come in handy for web designers and developers.

1. WhatFont

See a font you like or like how a font is being used on a website? Well, you don’t have to go through a whole list of fonts to match the one you liked.

Install WhatFont and it’ll recognize the font on any website. It’ll give you the name, line spacing, size, and the letter spacing as well. Moreover, it detects the service serving the font on the website.

Download Here

What Font Google Extension

2. Eye Dropper

If you’ve ever marveled at how wonderful a color is on a website and want the exact hex code for it, Eye Dropper will make life easier for you. The eyedropper tool will help you get the hex code for any pixel, on any web page, and store it in the history or copy it on your clipboard.

Download Here

Eye Dropper Google Extension

3. CSSViewer

Ever wanted to know all the CSS property details of the web page? Then CSS Viewer is just the tool for you! It shows designers the font, text, color, background, effects, and other such CSS properties of the webpage, so you can easily source the required information.

Download Here

CSS Viewer Google Extension

4. Image Downloader

This extension allows you to access all the images being used on a web page. You can also bulk download these images, filter them according to their dimensions, or see images that the page is linking to. With Image Downloader, you will never have to struggle with sourcing the images from the website!

Download Here

Image Downloader Google Extension

5. Code Cola

Using this extension you can generate CSS styles for any web page. Web designers can use this to modify web pages quickly without opening Photoshop. See what style looks best for your web page, copy the code and paste it in your code. Yes, that simple!

Download HereChrome-Extensions-Niswey-Code-Cola2-1-1086x529
Chrome-Extensions-Niswey-Code-Cola-1-1086x529

6. Web Developer

This is an extension designed to make a web developer’s life easy. It provides various web development tools ranging from CSS to responsive layouts. If you need to validate your website’s CSS, you can directly do it from the extension. It has abundant tools to help you with your website’s development.

Download Here
Chrome-Extensions-Niswey-Web-Developer-806x279
Chrome-Extensions-Niswey-Web-Developer2-1086x529 (1)

7. Project Naptha

This extension can save you from a world of trouble if you’re working on JPG mockups with content in it. Project Naptha enables copying and pasting text that is in an image.

Although it might not work with 100% accuracy, it’ll still give you enough to save you from a lot of rewriting.

Download Here
Chrome-Extensions-Niswey-Project-Naptha-1086x529

8. Muzli

Finally, this is an extension that is perfect for designers who are always on a look out for inspiration! It becomes your default tab, so that every time you open your browser, you get access to links of freshest design, UI, UX, interactive news and shots from around the web.

This way, you always stay updated with the world of design, and never miss anything.

Download Here

Muzli Google Extension

If you know any other Chrome extensions that are helpful for designers and developers, let us know and we’ll add them to the list.

We also brought together a list of free graphic design resources that may come in handy during a time crunch! Go check it out!