If you are a web designer or a developer, there are many Chrome plugins that will make your life easier. DevTools offer a lot of features, but lots of third party plugins can make Chrome even more powerful.

Read below our list of 22 essential Google Chrome plugins.

Blue Button

The Blue Button plugin is like an X-Ray machine for any website. It enables designers to see title tags, meta description, stylesheets, scripts, images and fonts. In just one click, you can see all the crucial website information.

Booom

The primary purpose of this Chrome plugin is to enable designers to have a better UI for Dribble.com. Booom not only makes Dribble.com faster but also packs lots of features:

• Lists feature high resolution shots
• Infinite scrolling
• GIFs autoplay
• Improved Add to Bucket UI
• Lists feature Like and Add to Bucket

Checkbot

Checkbot is one of the Chrome plugins that you absolutely need to use. This plugin checks if all the links in your website work. Furthermore, it checks for duplicate titles, invalid HTML / JS / CSS and redirect chains.

Chrome Daltonize

Daltonize is a simple extension for Chrome – it simulates color blindness in the browser. Having this plugin enabled shows you how a color blind person sees your website.

ColorZilla

This plugin works as a color picker tool, just click on any surface in your browser, and it will tell you what color it is. Also, this Chrome plugin comes packed with other features:

• Palette Viewer with 7 different pre-installed palettes
• Color history
• CSS Gradient generator
• Eyedropper
• Color analyzer for any website

CSS Peeper

Its creators made this plugin with designers in mind because it enables them to inspect code quickly, without the need to dig through the code. Furthermore, CSS Peeper allows designers to instantly see hidden CSS style of colors, assets and object on a website.

CSS-Shack

What CSS-Shack does is that enables designers to create designs in the browser and then export them in a CSS file for later use. It has many features and support for layers.

DomFlags

DomFlags is a plugin that enables you to create shortcuts to DOM elements, allowing faster workflow. Of all the Chrome plugins that can create shortcuts, this is the only one that can assign shortcuts to inspect DOM elements faster.

Dropmark

If you are using Dropmark, you can use this plugin to add images, screenshots and links to your collections quickly. To use it, you just have to click on the Dropmark toolbar button and right-click anywhere on the page.

Fontface Ninja

The purpose of this Chrome plugin is quite simple – it helps you determine what fonts are used on the website you’re browsing. Also, it enables you to try different fonts and buy them if you like them.

Highly Highlighter

Many Chrome plugins help you share highlights from articles you found online, but Highly Highlighter is the most intuitive of all. You can easily share interesting bits to your colleagues to keep the discussion going.

iMacros for Chrome

If you are a web developer, you probably have to test your websites before publishing. Where iMacros comes in handy is when you have to do the same process multiple times on the same webpage. You can use this plugin to record your actions and later perform the same set of actions with just one click.

Marmoset

If you are looking for a simple way to add parts of your code to an online portfolio or promo images, Marmoset is a plugin designed to help you with that. You choose which code you want, and it will create snapshots for you to use.

Muzli

Muzli is ideal for keeping your inspiration flowing – it compiles a feed from your favorite websites into a grid that can be easily accessed. The feed can be customized to your taste. However, when you install this extension, it will automatically become your homepage, an option which you can turn off in your settings.

Page Ruler

As the name of the plugin says, it is a ruler in your browser. You can use it to measure various elements and get pixel positioning and dimensions.

OneTab

Opening a lot of tabs in Chrome can take up a lot of memory, so you can use OneTab to sort all your open tabs into one list. This plugin is ideal for designers and developers who tend to open many tabs and can’t find later the one that they need.

Shift Click

Shift Click enables you to share images from websites you’re browsing quickly. After installing the extension, you just need to hold “shift” and click on the image you want. You will instantly get a shareable link to the image and basic info about it (resolution, color palette and file type).

SitePalette

If you are a web designer, this is one of the Chrome plugins you must have in your browser. When you find a website that has the perfect color palette, you can use this plugin to extract the main colors. It will also create a shareable palette that you can send to colleagues or collaborators.

Sizzy

Sizzy is an excellent Chrome plugin to check whether your responsive design works as it should across all devices. This plugin can render your website in different sizes, switch between portrait and landscape modes and show or hide a keyboard.

Toby

Toby is a plugin similar to OneTab, but it functions differently. It organizes all your open tabs into collections of links, which makes them easier to view and manage.

WhatFont

WhatFont is a Chrome plugin similar to FontFace Ninja, with the only difference being that it provides more information. It not only tells you which font is used but also style, size, weight, color and line-height.

Window Resizer

This plugin simply emulates different resolutions by resizing your browser window. The idea is to see how your website performs in different sizes.

Whether you’re looking for inspiration or you want to test the performance of your website, these Chrome plugins can make it happen!