Thursday, November 19, 2015

29 Free Online Design Tools for Creating Stunning Visual Content for the Web

Free_Design_Tools.jpeg

Who doesn't love free stuff?

If I can find a free tool to do something I'd otherwise have to pay for in my marketing, I'm going to try the free one first. As long as I can achieve the same quality result from the free tool, there's no need to waste budget. 

And in my quest to find alternatives to fancy computer programs, I've come across a lot of free tools that help take my marketing up a notch. In particular, I've adopted a ton of free tools for creating visual content that don't cost my team a dime. From templates to browser extensions to online photo editors, keep reading to see some great, free web design tools to use.

Click here to download our free templates for designing visual content like infographics, social media graphics, SlideShare presentations, and more.

29 Free Online Design Tools for Creating Stunning Visual Content for the Web

Free Font Tools

1) Type Genius

Need to find the perfect font combination for your next project? Type Genius makes it easy for users to find great combinations of fonts. It even provides real examples of font combinations being used on other websites to help you get a better sense of how it will look. 

2) Google Fonts

If you're looking for quality typography for your next design, check out Google Fonts. This directory of web fonts makes it easy for users to add a font to their website in seconds or download it to their computer to use later.

All of the available fonts are open source, meaning users can customize, improve, and share them as they see fit.

3) WhatFont

Ever come across a font on a particular web page and think to yourself, "I need that." With WhatFont, users can quickly and easily identify the name of the fonts used on any web page in just one click.

Available for download as a bookmarklet, Google Chrome Extension, or Safari Extension, you'll never be left feeling stumped about a font name again.

4) DaFont 5) 1001 Free Fonts & 6) Font Squirrel

Looking for an extra special font to help your design stand out? While there are a ton of free font resources out there, we've narrowed down our favorites to: DaFont, 1001 Free Fonts, and Font Squirrel. 

These sites offer up an extensive library for fonts that are high quality, easy to download, and clearly defined in terms of licensing. 

7) Tiff

Ever find yourself stuck between two fonts? With Tiff, users can select two different fonts to overlay against one another, making it easy to spot the differences. You can even choose which letters you'd like to compare -- both capitalized and lowercase. 

Tiff currently supports all Google Web Fonts and any system fonts. For best use, the site recommends viewing the contrasts on the latest version of your browser. 

Free Templates

8) HubSpot's 10 Infographic Templates 

We all know we need to create visual content. Trouble is, creating graphics can often feel like a huge undertaking -- especially if you don't have a design background.

With this pack of free infographic templates, you can create professional-looking infographics and save hours of time in the process. The best part? You can easily customize them to fit your company's branding. 

infographic-templates-8.png

9) Canva

Whether you're looking to create an ebook, infographic, business card, or email header, Canva has a template to simplify your process. In fact, the free web design tool offers professional, easy-to-customize templates for just about any design need you can think of. 

The best part? The tool is built with non-designers in mind, making it easy to drag-and-drop objects and images until you like the way it looks. Change the images, switch up the fonts, adjust the colors, and voilà: You've got yourself a design you can be proud of.

10) HubSpot's 50 Customizable CTA Templates 

If you want to drive your website visitors to take an intended action, you need to make it easy for them to do so. That's where CTAs come in.

But not just any old design will do. In fact, factors like color, size, and shape, all play a role in the performance of your button. So to help you encourage more visitors to become leads, we've created 50 pre-designed CTA templates to employ on your website. These templates are customizable, and we encourage you to test different colors and placements until you find what works best for you.

CTA_Templates.gif

11) PlaceIt  

Sometimes, you need a photo of your website, blog, or Twitter profile with a little polished flair. While you can try manually customizing your screenshot to fit into a stock photo you already have, PlaceIt is an even better alternative. Upload photos directly into Creative Commons-enabled stock photo templates and watch your screenshots come to life.

placeit

12) HubSpot's 5 PowerPoint SlideShare Templates

Love the concept of SlideShare but don't have a lot of experience designing in PowerPoint? No problem. 

With our free PowerPoint templates, you can create beautiful SlideShare presentations without the heavy lifting. Simple plug in your content, adjust the colors to match your branding, and swap out images as you see fit. These templates range from clean and simple to a bit more intricate, so you'll have no problem finding one that suites your content. 

Free Color Tools

13) Pictaculous

One of the most important elements of web design is your color palette -- you want to make sure your images, graphics, and font colors all help convey your message and maybe even drive conversions. But often, it's hard to find that exact shade of blue that's in a photograph you need to use -- which is where Pictaculous comes in. Upload a photo and then instantly get recommendations for colors to use, including their respective HEX codes. Your color palettes will never be uncoordinated again.

pictaculous

14) ColorZilla

ColorZilla is a great tool for your most basic to your most advanced color-related needs. Whether you're looking to pull up the HEX code for a specific pixel on a page, analyze DOM element colors, or uncover element information such as tag name, class, id, and size, this tool can handle it all. 

Available as either a Google Chrome Extension or a Firefox add-on, we're willing to be that ColorZilla will quickly become one of your favorite go-to design tools.

Free Annotation Tools

15) Awesome Screenshot

Ever find yourself drowning in 20 different programs to crop, edit, and annotate screenshots? With Awesome Screenshot, a browser extension for Firefox and Chrome, you can easily screenshot anything on the web and edit it directly within your browser. This extension has become a staple of my own browser -- I can't go back to regular old screenshots anymore.

awesome_screenshot

16) Skitch

Skitch, a handy screen capture program from Evernote, is a functional, free tool for helping marketers and designers "get their point across with fewer words." Users can use shapes, arrows, text, and doodles to annotate existing or freshly captured images -- and file them away to their Evernote account for later use. 

Don't have an Evernote account? No problem. All capturing, markup, saving, and sharing functions don't require an account. However, if you're looking for an organized, cloud-based place to save your Skitch photos, we recommend you use Evernote -- it's also free.

Free Photo Editing Tools

17) PicMonkey

Okay, let's say you don't have the budget for Photoshop and feel somewhat limited by PowerPoint's visual editing capabilities ... what are you to do? If you want to spruce up your images -- re-color them, add borders, add text, and even insert graphics on top -- all without downloading yet another program to your computer, check out PicMonkey. The whole photo editing process is intuitive, which means you can spend more time optimizing your blog posts instead of sprucing up its accompanying featured image.

Picmonkey

18) BeFunky

If you love the look of cool, vintage Instagram-esque photo filters, you'll love BeFunky. This free photo editor boasts a ton of awesome features, including effects, frames, graphics, and textures. 

Whether you're a seasoned designer or just getting started, the interface is super straightforward and approachable. All it takes is a few clicks to enhance an ordinary photo or create a collage worthy of sharing on your social accounts. 

19) VSCO Cam & 20) Snapseed

Okay, so these apps aren't technically "web design tools," but we think you'll find them useful enough to forgive us. Just hear me out ...

You're at an event. You're laptop-less. And you just took an awesome photo with [insert esteemed thought leader here] that you want to share on social media ... but it's a little dark. Bummer. 

With a mobile photo editing app like VSCO Cam or Snapseed, you can tweak your photo to perfection and share it on the fly. Both apps are available free for iOS and Android and come equipped with impressive, professional looking filters and functions.

For even more awesome photo editing app suggestions, check out this post from my colleague, Lindsay.

Free Stock Photo Resources

21) Compfight

If you're looking for a Creative Commons image, but are finding terrible options through its native search engine, check out Compfight. While it often surfaces similar content, Compfight has an algorithm that places the gorgeous images right at the top -- cutting my image hunting time down by a ton.

Bonus: You don't have to worry about correct attribution because Compfight will automatically generate HTML codes you can embed in your website to properly credit the original author.

Compfight

22) Death to the Stock Photo

All it takes is an email address to start receiving Death to the Stock Photo's high-quality photography straight to your inbox every week. From office shots to drool-inducing food plates, this free stock photo service has a batch of photos to meet almost anyone's needs. 

These images can be used on your website, social channels, mockups, etc. To get familiar with the photo license, check out this helpful document -- written in plain English. 

23) Stock Photos From HubSpot

If you're looking for stock photos to use in your next design but don't want to worry about all that attribution stuff, well, look no further. HubSpot offers a ton of free stock photos that you can use literally anywhere. All you need to do is download the batch and then be on your merry way to create engaging, visual content. Seriously ... just do it. 

berries.jpg

24) 250 Holiday Stock Photos From HubSpot

Us again. In case you can't find what you need in that resource up there, we've also created a holiday-specific set of stock photos for you to use as you please. This set includes photo packs for Halloween, Thanksgiving, Hanukkah, Christmas, and New Years. 

25) Unsplash

If you're looking for more "do whatever you want" photos with a scenery or inanimate object tilt, check out Unsplash. Just like our own stock photos, no attribution is needed. The pictures speak for themselves -- so go check out the website for more.

UnSplash.jpg

Free Interactive Design Tools

26) Infogr.am

If you're looking to make interactive infographics -- not just plain visuals -- check out this online design tool. Easily add graphs, maps, text, and even playable videos without diving deep into a design program. It also has social sharing tools built right into the infographic, so you don't have to worry about creating a custom Pin-It button. It's a pretty nifty tool if you want to create and ship an infographic -- fast. 

infogr.am_example

27) InVision & 28) Marvel

Depending on the sophistication of your design needs, you may find yourself in need of a prototyping app. This type of software can be used to turn your ideas -- whether it be an app or a website that you've cooked up in your head -- into a more tangible reality. 

While there are many free options available, we've selected two that really deliver in terms of ease of use and functionality: InVision and Marvel. Although InVision does offer more advanced, paid plans, you can get started with one prototype at no cost. As for Marvel, a free plan will grant you access to unlimited projects with no limits on time. 

Free Drawing Tools

29) Google Drawings

Say goodbye to your weird Microsoft Paint drawings and say hello to polished, professional Google Drawings. If you have a personal Gmail or your company uses Google Apps, you can use Google Drawings to create custom visual content. One of my favorite features about it is that it comes with an invisible background right off the bat so you can create custom shapes that can easily be pasted on top of your other marketing collateral -- the perfect way to spruce up an updated ebook call-to-action or even customize a stock photo. And the best part of all is that you can collaborate with your co-workers on the drawing by sharing the document, just like you would any other Google Document. 

Google_Drawing.png

And that's just a few of our must-have visual tools. What programs and resources do you use to create visual content? Share them with us in the comments section below.

Editor's Note: This post was originally published in September 2013 and has been updated for freshness, accuracy, and comprehensiveness.

free visual content design templates

No comments:

Post a Comment