40 Useful Google Chrome Extensions for Web Designers

I love Google Chrome. Its simplicity, speed and performance are top notch, undoubtedly. But sometimes, being too simple is also a problem, especially for us web designers who rely heavily on Firefox addons like Web Developer. I walked away from Chrome, yeah, just because it had no addon back in 2008.

But now, everything changes again. It has no surprise that other geeks are having the same love to Chrome and they decided to create Chrome Extension, which has similar function to Firefox Addon. I digged into those extensions and was very satisfied to them, therefore I decided to pick up 40 extensions which is extremely helpful for web designers and share with you guys.

So here they are for you, gear your Chrome and boost your productivity up.



Just as its name, ColorPicker is a convenient extension created mainly to pick and get color’s value from anywhere on the web page. Additionally, you can pick an area then click on the color palette to see how the area’s color changes without touching any code.

Chrome Palette

Having headache on finding color scheme from image? Chrome palette solves your problem efficiently by create up to 64 color palettes from website’s image for your design or inspiration needs.

Colour Tweaker

Colour Tweaker can modify the color of the website as Color Picker does, but with a more specific method. Just input the CSS selector on this extension then tweak the color of the text, background and border color to your will.


Font Editor

No more guessing and tiring program switching, Font Editor allows you to modify and observe font setting like size, line height and variant lively.

Google Font Previewer

As specified in its name, this extension allows you to preview font from Google Font Directory with text styling options which are size, style, weight and shadows. If you are satisfied with particular font, you can copy and paste the link and the CSS code provided in the extension to your website’s code to use the font.


Web Developer

Probably the must-have extension for web designer and developer. From viewing script to display object information, Web Developer aims to provide every piece of information you need from an existing website. The extension is also armed with useful tools like color picker, window resizer, validator, etc.


Lightweight and handy developer tool that’s similar to the Web Developer, but only equipped with necessary tools like style viewer, source viewer and validator.

Firebug Lite

Different from what it is in Firefox, Firebug Lite offers Firefox-like visual representation when it comes to HTML elements, DOM elements and Box Model Sharing. It also comes with the ability to inspect HTML elements with your mouse, and you can edit CSS properties with this extension lively.


Stylebot grants you the ability to style any website directly without touching CSS code, which saves a lot of typing work. The best feature of this extension is probably its ability to generate CSS code for your use everytime you make a change to the website.


Tired of pushing ‘Inspect Element’ everytime you want to know what CSS style is applied to certain element? CSS Viewer helps you by display essential information such as font, color and positioning of the element lively.

Stylesheet Reloader

Reloads CSS stylesheet without refreshing entire website, which greatly saves your waiting time especially for designer with slow internet connection.

BuiltWith Technology Profiler

The coolest part of this extension is it lists out every implemented web technology such as frameworks and web standard with very detailed information.

IE Tab Multi

Proved to be the most similar one to the original Internet Explorer, IE Tab Multi is your Internet Explorer within Chrome which supports tons of IE’s default feature like multi tabbing.

Window Resizer

With Window Resizer, you can test your website’s screen resolution compatibility with standard or user-defined screen resolutions.

HTML Validator

One of the best validator extension that can validate HTML code of online or localhost web page in either auto or manual mode. You can also choose to show the validation result in the web page or view it in a completely new tab.


With various theme and font options, Sight highlights the source code of the website into a more visually comfortable form.

PHP Console

Being bugged by PHP erros but don’t know what and where it is? PHP Console assists you by display errors, exceptions and debug messages in notification form.

JavaScript API Search

JavaScript API Search adds support to the Chrome Omnibox, or so called address bar to search for JavaScript functions online with autocomplete feature. If the extension cannot find the function you are searching for, it will further suggest you related searches from Google Codesearch, Development and Coding Search, and the Mozilla Developer Network search.

jQuery API Search

While jQuery has proven itself to be the leading Javascript library that improves user experience, jQuery API Search grants you the ability to search though jQuery API from Chrome Omnibox. Just type ‘jq’ followed by a space in omnibox, then you are on the go.

PHP Search

Similar to jQuery API Search, this extension adds support to your Chrome Omnibox to search PHP code for your reference use.


Stay Focused

Swored to keep yourself away from time wasting website but never did it successfully? Stay Focused acts as your virtual supervisor that blocks time wasting website for a specified time, and advises you seriously when you try to unblock or decrease the blocking time for the site. It’s also armed with crucial feature like nuclear option and challenge mode which kills your time wasting desire in a merciless manner.


With PopChrom, you can define your own shortcuts for text phrases, such as ‘ty’ for ‘thank you’. The activation key is needed to transform the abbreviation into the defined text phrases, so choose a key combination that does not crashes with other shortcut key.

Quickrr Productivity Kit

Quickrr Productivity Kit provides you a bundle of basic yet useful tools such as translator, calculator, task-to-do, unit converter, etc.


With an easy-to-setup account, you can access into this task manager to jot down and edit every task you need to complete. The best part of this extension is your tasks are stored online so you can access the task record on every Chrome with this extension installed.

Ananke Timer

Track your time spent on certain task, or record the time you spent on particular website. Ananke timer also supports multiple time tracking and allows you to browse though what you have tracked in past.

Chrome Toolbox

Created by Google, Chrome Toolbox brings you custom features like tab behavior modification, form data restoration and shortcut creation that launches predefined links from bookmark folder.

Chrome Page Extended

Nobody loves to click more to access certain page, Chrome Page Extended is your fastest shortcut to access all necessary Chrome page like Extensions.


With AppJump, you can organize and quickly launch Chrome application from browser toolbar.

Bookmark Bar Switcher

Too many bookmarks and failed to organize them efficiently? Boorkmark Bar Switcher allows you to create brand new bookmark bar and switch between them easily.


Save your windows sessions and restore them later on any computer with TabCloud, which saves you a lot of time from re-open different website from different part of bookmark folder.


Similar Pages

Developed by search engine giant Google, Similar Pages searches the web for similar web content that you are reading and interested to discover more.

Universal Search

Resourcing or referencing are easier with Universal Search, which gives you an search box with option to search on Wikipedia, Bing and other search engines. The search box will also pop up when you highlight any text from the website you are currently viewing.

Awesome Screenshot

A totally awesome screenshot extension that captures any part of the website and annotate it with rectangles, circles, arrows, lines and text. You can then export the screenshot in PNG file format to your computer or web.

Clip to Evernote

Official extension by Evernote to capture and note your discovery on the web then upload to Evernote. The extension also supports the feature to search and synchronize your saved note.


Use Diigo to hightlight, annotate or post sticky notes privately or publicly to the web page so you can view it on anytime you reach to the web page.


Think Thinkery as your online brain, then save your link address and text selection into it for viewing later.


Note taking should be an easy process, and it’s possible with myNotes which allows you to bookmark selected text with just one click on the context menu.

Microstock Photo Power Search

Probably the only search extension for you to look for high quality stock photo from famous agencies like Fotolia, Dreamstime and Shutterstock.


As Chrome extensions and applications continue to grow and evolve wildly, it’s possible that more and more Firefox lover will embrace the Google Chrome as their default web browser. With that being said, will you turn your face to Google Chrome with its current number of extensions and applications? What’s the extension, application or feature that will motivate you to move to Google Chrome?

Also do share to us if you have nice extension in your Chrome, there’s always a space for great tool!

Show Comments