My students are always asking me about my favourite resources, how do I make a php form? How can I choose colours for my design? etc, and so I’m sharing my top ten with you. They’re online, they’re free and they’re all incredibly awesome. I use these sites all the time and I hope you find them as useful as I do. One thing that really excites me about the web is the ability for anyone with some skills and talent to just put together a resource or helpful product and give it away for free (with the ubiquitous ads of course) and over the years so many people find them incredibly useful. Sites like these really pioneer what the web is all about.

Please let me know if you find any other kickass, free online resources that belong on this list, and enjoy!


1. BG Patterns

Change the graphics, colours, size and transparency. There’s no repeating web background you won’t be able to create. Amazing and awesome!bgpatterns Top 10 Free Online Resources for Designers

2. Dafont

Choose and download fonts for free, hundreds of new fonts every month and even an online display to help you see how your words will look in each font. A must for students and designers alike.dafont Top 10 Free Online Resources for Designers

3. Email Me Form

A free account with these guys will get you 5 free forms per account. You can go back and edit the forms as much as you like, add all the fields you need and they write and host the php for you.

emailme Top 10 Free Online Resources for Designers

4. Favicon Generator

What is a favicon? I hear you ask. Well it’s the little graphic that appears in the address bar. It also gives you a pic when you bookmark a site rather than the generic page icon that your browser assigns a site if there’s no favicon installed.

faviongen Top 10 Free Online Resources for Designers

5. Icon Finder

A great search-able resource that links you with icons and their creators so you can download whatever icons you like, mostly for free. Check before you click.

iconfinder Top 10 Free Online Resources for Designers

Multicolr Search Lab

The folks at Idee extracted the colours from 10 million of the most “interesting” Creative Commons images on Flickr. You can navigate the collection by colour using up to ten colour combinations. It’s fascinating.

idee Top 10 Free Online Resources for Designers

7. Kuler

Kuler is a fantastic resource brought to us be Adobe and this is why it syncs so well with Adobe products. You can mix and match colour palettes, use combinations suggested by others or extract colours from an image and then download it to your Illustrator swatches. Awesome.

kuler Top 10 Free Online Resources for Designers

8. Random Text Generator

Sick of Lorem Ipsum Dolor? I know I am. This handy little tool generates real dummy text. Just don’t forget and send it print without replacing it with the real stuff!

textgen Top 10 Free Online Resources for Designers

9. Typetester

I’ve saved one of the best for last. This little beauty shows all your web text selections side-by-side and gives you options for colour and sizing. Indispensable for any web designer out there who cares about legibility and readability…which is all of you of course!

typetester Top 10 Free Online Resources for Designers

10. Website Grader

Simply type in your URL and this tool will produce a great, easy-to-read report that gives you a score and suggests areas for improvement, in terms of SEO, web standards and accessiblity. Fantastic. I’m pleased to say Moonsail Design scored 93%.

websitegrader Top 10 Free Online Resources for Designers