Great (Free) Web Design Tools

Great Free Web Design Tools

Great (Free) Web Design Tools

As a designer, I am always looking for tools to make my work better and easier to create. Over time, I’ve collected a number of great, free tools that I use on daily basis. Most of the time, I go directly to one of my bookmarked tools for a specific purpose as I design. Other times, when in need of inspiration, simply perusing these tools is often enough to spark new ideas. 

Check out the following tools to see if they can help you in your design process.

Inspiration

Benchwarmer

My colleague introduced me to this tool a few months ago and I’ve been in love with it ever since … With this Google Chrome extension, every time you open a new tab in your browser, a page full of new and inspiring designs appears. The designs are fed to the page through the designer site – Dribble – that allows designers to display their most recent work.

Sometimes I will see a shot of someone’s recent work and be inspired by the color palette or typography and apply that inspiration to my next design. Benchwarmer is great for keeping the creative juices flowing.

Benchwarmer

 
Visual.ly

Visually is a site full of awesome infographic themes that visitors can use to create their own custom infographics. When I need to make an infographic, or even just an illustrative design, I like to look at the infographic showcase on this site. The designs on Visually are modern and fun, and I like to get inspiration for funky design elements here.

Visually

 

Typography

What Font

As designers, we frequently look at great web designs and say to ourselves, “Wow, I love the type on this page! What is it!?” Well, of course we can “inspect element” and figure it out, but an even faster way is a nifty little plugin called WhatFont. With this tool,  you simply highlight the text in question and right click to find out the font. 

What Font

 
Font Squirrel & Google Fonts

These are my go-to sites for free fonts. Both sites allow users to download web fonts for free, and Font Squirrel even has a webfont generator that provides the CSS to embed a desired font. Pretty handy!

Font Squirrel

 

Google Fonts 

 

COLOR

Webcolordata

This is one of the coolest tools I’ve seen. Simply enter the url of any site and press a button to get the exact hexadecimal color codes of the color scheme used for the site, as well as an analysis of which hues are used the most. Additionally, this tool provides a list of other sites that have similar color schemes.

Web Color Data

 

Adobe Kuler

This Adobe tool allows members to peruse an extensive color scheme gallery, and contribute their own color scheme. This is a great tool for inspiration and can help perfect the color palette of your design.

 kuler

 

OTHER 

Fontello

Need an icon? Fontello probably has it. Fontello allows you to embed icons in your site or even download a font file that you can use to display icons in software programs. Learn more about Fontello here.

Fontello 

 
Twitter Bootstrap

Bootstrap is a new tool we've started using that makes our job of producing beautiful websites a lot easier. It is a 12-column responsive grid structure built on top of LESS that gives us a lot of really neat features like font icons and built in components like navigation bars and tooltips.Check out the Bootstrap project on GitHub or the Bootstrap theme on Drupal.org.

Bootstrap

 

Do you have any design tools to share? Leave a comment below!

Enhanced by Zemanta

Related Posts

Tools, Tips and Tricks on Being a Great SEO, Social Media Expert, or Internet Marketing Specialist

Tonya Cauduro
Read more

Design Tools For Creating Pretty Drupal Sites

Brent Bice
Read more

Four Free Tools for Reporting Social Media Activity

Litany Brown
Read more

5 Free Tools for Creating Share-Worthy Visuals

Gretchen Bice
Read more

Ten Free Fonts for Beautiful Design

Gretchen Bice
Read more

6 Cures for the Creative Block: Web Design Tools for the Uninspired

Gretchen Bice
Read more