Favorite Web Graphic & Font Tools

Here’s a guide to my fave web graphic & font tools I use daily for web fonts, colors, graphics, and more!

Favorite Web Graphic Tools

Canva

Oh, where do I start, with Canva? This is a fantastic, free website that lets you create all kinds of graphics, for web and even print.

You can add your own photos or backgrounds, or choose from thousands of free ones (or pick fancier ones for as little as $1). I use Canva regularly, to create graphic banners for social media posts, blog posts, articles, event invitations, and even PDF printable posters.

You don’t have to be a graphic designer to create fancy graphics, nor have a a steady mouse hand to design things with Canva. It makes everything easy.

Maybe you’re not creative or have no idea where to start on a design. Canva has many very professional-looking premade templates available, which are updated regularly for holidays and seasons.

When you drag elements on the screen, Canva snaps to just the right location as needed, so nothing can ever be crooked. Canva also saves all your designs, you can download them as PNG, PDF, and more.

You can even re-use or copy designs you previously made but want to make a simple change to, which is great for branding ease and consistency of layout. You can also upgrade to a paid version for a few bucks a month, and add team members to your account, where they can set up a folder that has all your brand logos, color palette, fonts, and everything for sticking to your brand’s guidelines. I could go on, but I think you should just check it out for yourself and thank me later.

To learn more about Canva and add it to your arsenal, go here: https://canva.com/

Color Cop

Color Cop is the easiest and most robust simple color-picker and color-grabbing tool I can recommend, and I have been using it since probably 2008!

It has come in handy more than a thousand times, when I needed to identify and copy/paste the code of a color or use it for creating graphics, updating or changing CSS style sheets on the web, answering client questions about what color their logo is using, and more.

With Color Cop, you can find out the HEX or RBG code of any color on a computer screen, whether it be sampled from a photo, a background of a page, or even from other graphics.

You simply click the dropper icon and drag it to whatever you want it to look at, to get the color codes. Additionally, the last 7 colors you sampled are always available in the squares to the right of the main window.

Download & learn more about Color Cop: http://colorcop.net/

Easel.ly

By now, you’ve no doubt seen an infographic. It’s an image that outlines and explains many things in one glance. Visual content such as infographics gets more exposure and shares on social media than many other kinds

Easelly is a simple infographic maker that lets you visualize any kind of information with infographics as it offers a free way to create visuals without hiring a designer. You can create eye-catching presentations and improve communicating your ideas better.

Did I mention Canva does the same thing?

Google Fonts

You may have known about Google the search engine, and all the tools Google has to offer in terms of pretty much ANY aspect of your work and personal life (Maps, Gmail. Calendar, Android phones, etc.).

But did you know that they also offered free web fonts? Yep. I am sure I have been using Google Fonts for many years now, to discover great typography and implement it on mine and my clients’ websites and other things.

Not only are the fonts free to use for both personal and commercial use, they even provide the CSS for you to paste into your site’s style sheet, or you can choose inline styles. They also let you download the CSS styles if you prefer not to link to Google’s CSS file in your site’s headers.

To top it all off, while you are browsing through the thousands of fonts, Google will even display fonts that are similar to the ones you’re looking at, and also suggest a list of fonts that pair nicely with it. This is ideal for creating heading type styles and body text styles that look great together and do not clash.

Start exploring and using Google Fonts today: https://fonts.google.com/

What the Font?

This website has been a lifesaver for me in many ways. For example, I had been given a logo to reuse in a graphic, but was unsure what font the logo was using.

What The Font tool lets you upload an image with the font in it, and then asks you a few questions. Then it can magically tell you what font it is, because the technology it uses can pick through the world’s largest font repository to figure it out. In some cases, it will not have the exact font, but very close, if you’re not that picky.

Once you figure out the font, What The Font shows you were to download and/or buy the font.

You can also upload the image for the font in question and share it with the community of users who are font experts and most of the time, they are wizards and help identify nearly everything!

Go here to instantly figure out What The Font? https://www.myfonts.com/WhatTheFont/

Another similar tool that helps you figure out what font you’re looking for, is Identifont: http://www.identifont.com/

Snipping Tool (Windows)

This is probably one of my most-used tools on my PC that I use more than once a day. It can easily capture a whole web page, rectangle, or free-form snip.

Snipping Tool also has the ability to copy, save as PNG, JPG or GIF, and you can also draw on top of it with a pen tool or highlight using the highlighter pen.

Learn how to use the Snipping Tool on Windows here: https://snippingtool.net/snipping-tool-for-windows-10/where-to-find-the-snipping-tool-in-windows-10

If you’re using Mac OS instead of Windows, there is a similar tool called Screenshot outlined here: https://support.apple.com/en-us/HT201361