Google Chrome is by far the world's most popular web browser, and part of its appeal lies in the ease with which you can add extra functionality through extensions, taking it far beyond the business of looking at web sites.
Naturally there are loads of Chrome extensions (opens in new tab) out there for web designers and developers, but there are also plenty of add-ones that'll make your life just that little bit easier, no matter what design discipline you're working in. Here are 10 of our favourite extensions that you're bound to find useful at some time or another.
01. ColorZilla
We've all found ourselves taking a screenshot and pasting it into Photoshop to grab some colours from a website for a project; it's not ideal, but it works. With ColorZilla (opens in new tab), though, you can grab those colours right in the browser. Not only does it let you use a Photoshop-style eyedropper on any pixel in your browser window – including Flash and dynamic hover elements – and get HSV, RGB or hex values for it, it'll also generate a colour palette for any site and even features a CSS gradient generator and much more besides.
- Adobe Color gets fantastic new palette-picking tools (opens in new tab)
02. WhatFont
There's nothing quite so annoying as seeing a gorgeous font on a website and not being able identify it for future use. If you're comfortable with Chrome's developer tools then it's pretty straightforward to find out what a particular font is; if you're not then you'll find WhatFont (opens in new tab) to be a lifesaver. When it's activated you can identify web fonts by hovering the mouse pointer over text, and it'll also detect the services used for serving them, making it simple to track down fonts and add them to your own library.
03. Session Buddy
Tabbed browsing is one of the 21st century's greatest invention; that is until you find yourself with a dirty great swathe of unidentifiable tabs filling the top of your browser window and taking up most of your computer's memory. Session Buddy (opens in new tab), however, makes it much easier to cope when you have too many tabs on the go; it's a unified session and bookmark manager that enables you to eliminate browser clutter by saving open tabs and restoring them later, and also to organise saved tabs by topic. It'll recover all your open tabs after a crash, and it even lets you search all your tabs to quickly find what you're looking for.
04. Resolution Test
Most people aren't too worried about the size of their browser window, but designers can often benefit from being able to resize it exactly. If you're in web design then testing site builds across different viewports is a must, and if you're taking screenshots of your work for your portfolio site then it's a bonus to be able to do it at the right resolution for your site rather than resize it in Photoshop and lose a little visual clarity. And with Resolution Test (opens in new tab) it's easy to set your browser to exactly the size you want; simply choose from its dropdown list or add your own resolutions.
05. StayFocusd
For all its many benefits, the trouble with working on a computer is that it's so easy to get distracted when you need to be productive. How are you supposed to get started on that pitch when there's all that Twitter to catch up with and important cat videos to watch? If you need a bit of help getting things done, StayFocusd (opens in new tab) is ready for you; with it you can restrict the amount of time you spend on time-wasting websites, and once you've used it up they're blocked for the rest of the day. It's highly configurable, allowing you to block anything from entire sites down to specific types of content, and it's an excellent way to force yourself to hit those deadlines.
06. Sticky Notes
It's always handy to have a means of taking notes when inspiration strikes out of the blue or if you need a reminder, and this extension enables you to do just that within the browser. Describing itself as the most beautiful, easiest and fastest note-taking experience, Sticky Notes (opens in new tab) enables you to have up to nine notes on the go, and features a selection of fonts and all the text formatting options you're likely to need, as well as animated themes and the ability to work offline. It'll back your notes up daily, and you can even export them as a text document or PDF.
07. Smart PDF
PDF is a phenomenally useful format but it's not without its faults, as you'll have discovered if you've ever tried to copy text out of a PDF and discovered all those hard returns that you have to remove by hand. With Smart PDF (opens in new tab), though, you'll find that you have a much easier time with the format; not only will it convert Word, Excel, Powerpoint and JPG files to PDF, it'll also convert them the other way, and it'll also save the results straight to Google Drive or Dropbox for you.
08. Spectrum
When you're building websites and making sure they tick all the accessibility boxes, are you checking how they'll look to people with colour blindness? Around 200 million people worldwide have some kind of colour vision deficiency, and if your site's reliant on data visualisations or colour coding then they might be able to see it properly. With Spectrum (opens in new tab) you can test your site against different types of colour vision deficiency and see if anything's unclear.
Related articles:
- A guide to Google's web tools (opens in new tab)
- Create collage effects in the browser with CSS (opens in new tab)
- 20 best UI design tools (opens in new tab)
