
If you’re a web or digital designer and using Google products while you work, chances are your browser of choice is Google Chrome – and if that’s the case, good news because there are so many amazing free chrome extensions that will definitely come in handy in your day-to-day being a creative all-star designing websites, ad collateral, infographics, and more.
Below is a list of our 10 fave free Chrome Extensions for web designers right now in no particular order:
Before ColorZilla, I used to download or screen cap images on my web browser and then upload them to photoshop to find out the hex code colour so I could use it in my design. That was until one of my colleagues put me onto ColorZilla!
ColorZilla is an all-in-one tool that not only includes a Color Picker, which will easily allow you to find and copy a colour code and paste it into whatever program you need it to – but it also includes an Eye Dropper, Gradient Generator and some other fun colour tools that come in handy on the daily.
Download ColorZilla Here
While the above-mentioned tool can cut out a couple of steps in figuring out what shade of colour you’re trying to match – finding out what exactly that super rad font you stumbled across on the web can be a bit more tricky.
Then came along WhatFont – WhatFont easily allows you to identify any web font in your browser window just by hovering over it. Not to mention, WhatFont not only comes as a chrome extension, but you can also download it from the Apple App store! Currently, WhatFont supports Typekit & Google Font API, and is a must-have for anyone who’s into digital design, fontophile or not.
Download WhatFont Here
My next recommendation is a tool that allows you to test and visualize your website on any device (desktop, laptop, mobile, tablet) and any browser, as well as multiple versions of those devices and browsers – which is key to ensuring your responsive website works as perfect as possible no matter how users are viewing it.
Sizzy also comes as a full web version or as a chrome extension, and it’s one of the most popular cross-device testing tools out on the market, free or paid.
Download Sizzy Here
Lorem Ipsum Generator allows web designers to generate, yep, you guessed it, Lorem Ipsum text whenever you might need it for a mockup. It also provides optimization settings in order to get just the right type of dummy text for your websites such as how many paragraphs or sentences you need.
Lorem Ipsum Generator is not the sexiest of the chrome extensions for web designers tools available, but definitely one that will come in handy on the regular.
Download Lorem Ipsum Generator Here
I have to say, this is one of those apps that really works well from a practical standpoint for a number of different roles within a web design or web development agency, especially when you’re working with multiple designers or devs on a given project at the same time.
How many times have you said to a colleague, “I’m not seeing those changes” and they respond “Did you clear your cache?” and boom, changes are in fact applied. If you work on a team, or at an agency, this comes up at least once a week.
Well, this extension allows you to clear your cache in one easy click directly from your Chrome extensions bookmark tab. You can change your settings on the extension to enable it to default auto clear all other histories optional like cookies, browsing history, etc.
Download Clear Cache Here
Fans of the original Page Ruler will be happy to use Page Ruler Redux after the original extension creator transferred ownership to a new developer, who then added a third-party analytics tracking scripts that was stealing user’s passwords and sensitive data – no bueno!!
Thankfully – Rocha.Codes snagged the clean code from the original tool and recreated it as a new and improved version that promises it will NEVER contain adware or malware.
Page Ruler Redux will allow web developers and web designers to determine perfect pixel dimensions and height and width measurement of any website’s page elements with ease!
Download Page Ruler Redux Here
Designers looking for inspiration on other websites they come across will absolutely love CSS Peeper, which is similar to one of it’s slightly more used counterparts CSS Viewer. It allows you to easily inspect CSS styles of any objects, colours, and assets you might find, in a simple and aesthetically pleasing interface.
Download CSS Peeper Here
Is a super handy tool that allows you to easily annotate any screenshot that you take by storing them automatically in the extension’s project dashboard.
It is the easiest way for you to capture screenshots and organize user feedback and bugs on any given website for later use.
Download Usersnap Here
Image Downloader allows you to conveniently bulk-download all images on any given webpage into one folder, and easily filter and find them for whatever use you need.
It’s simple, open source, and will always remain free both in price as well as from malware and advertising.
Download Image Downloader Here
This Chrome extension right here is incredibly helpful for both designers and developers who come across WordPress websites that they love and want to replicate in structure or find out what plugins are installed.
There are several other similar plugins that detect themes but this one IMO is the best on the (free) market.
It not only detects themes and plugins, but it also lists their price or whether or not they’re free, as well as where to download them.
Download Scan WP Here
Hope you all enjoy our list of the 10 absolute best free Chrome Extensions for Web Designers!
Are there any that we missed? If so, please add them in the comments below!
You're one step closer to a FREE 20-minute consultation with an industry leader!