Top 5 Chrome Extensions for Web Design
If you want to make your web design journey a little smoother, these are some of my favorite Chrome extensions that save me time and gives me inspiration when I come across designs I like and wonder, 'What font is that??'
So let's get into it!
1. WhatFont
As the title suggests this extension is to discover fonts. Ever surfed a site and wondered 'What font is that?' Install this extension, click on it in your toolbar then hover over the font you're interested in. It will tell you the name, size and even font weight (bold, semi-bold, etc). Super handy especially if you're a typography person like I am. Your fonts and font combo say a lot about your brand and your vibe. So don't be afraid to come back and revisit your font for your website. This extension will keep you on your typography toes.
2. Colorzilla
I looooove this plugin. This is incredibly handy because I'm always handling multiple brands and although sometimes I do memorize the hex code, this helps me have a little bank of them because of the colour history. Click on the Colorzilla icon in the toolbar and hover over a colour a web page — the hex code will pop up. Click on the color to copy the hex code to your clipboard and save it to your colour history. You don't have to memorize anything and it'll help you discover new colours if you're thinking that the green you have 'isn't quite right'.
3. Chrome Capture
I use this A LOT. This lets you to save just a section of a page, the whole tab or the whole scrolling page (handy!) and THEN lets you edit it like cropping, adding text, arrows, highlights, etc. It's so handy for the clients, text tutorials or screenshots and I've created gifs for emails. I love this extension. I do have the Premium version ($12.99) that allows you to record your screen to create a gif or a short video and then edit it to add text and arrows as well. Super handy, easy to use and has never crashed my browser. Woohoo! 🙌
4. Lorem Ipsum Generator
Lorem Ipsum is a fake language that designers use to fill in content when there is none to present a design layout. I use this for myself when I'm trying to figure out a layout and want to balance content with the image.
I'll grab a paragraph or two, paste it into the design then keep designing so that I don't get stuck on having to write content right at that moment. I have a title for it because I know what that block is for and what the visual story flow is, but I will come back and fill the content in when I've worked my way down the page.
The placeholder content gives me an idea of how much I need to write and if the image size is right. If I end up needing more (or less!) content, I'll adjust the number of columns and/or the size and type of image.
Just don't forget to go back and rewrite!
5. Block Yourself From Analytics
This helps me block my visits from client sites. Since I'm on their sites a, lot especially during heavy design periods, I can skew their analytics. So I block myself from it. I don't always have access to their Google Analytics so this is a very quick way of getting the job done. Just install, go to your site, then click on the extension icon in the toolbar. Choose 'Block analytics from this site' and it'll be added to the list. You can always view the list and add/delete a site. Useful!
And those are my top 5!
You might like...
