Web Design Toronto | Internet Marketing | Inbound Marketing | Certified Hubspot Partner | Social Media Marketing | Online Marketing Strategies | Business Blog
A Non-Designers Guide to Choosing Website Colours and Fonts

Follow the WhiteSpace Blog Follow WhiteSpace  on Twitter Follow WhiteSpace  on Facebook WhiteSpace LinkedIN

[Click to edit the title]

A Year In The Making – Download The 2013 WhiteSpace Blog Compendium

[Click to edit the title]

New Call\u002Dto\u002DAction

inbound marketing

[Click to edit the title]

New Call\u002Dto\u002DAction

[Click to edit the title]

  New Call\u002Dto\u002DAction converting\u002Dleads\u002Dinto\u002Dcustomers inbound marketing

Current Articles | RSS Feed RSS Feed

A Non-Designers Guide to Choosing Website Colours and Fonts


Although Photoshop and other designer programs in the Adobe Creative Suite are incredibly powerufl tools, they're not so easy to use, they're expensive, and they take a long time to learn. Luckily, there's a way to do everything from choosing a colour palette to editing photos to annotating screenshots using the following assortment of tools.



Tools for Choosing Colours and Fonts

If you don't know much about web colour, you might want to spend some time exploring Web-Colours-Explained – a handy website we found that will teach you the difference between the RGB and CMYK colour systems. You might also want to brush up on your basic HTML skills so you can learn how to use a HEX code (a 6-character alpha-numerical code that represents a colour such as #FF0000). These HEX codes come in handy whether you're working on a website, designing an ebook or manipulating an image in photo editing software.

With the basics of colour and HEX codes covered, you can now begin exploring some tools that help you pick the right ones to incorporate into your designs.

Peruse DesignSeeds for bold and seasonally relevant colour palettes inspired by photos.


Use Colour Scheme Designer to pick one key colour, and view various schemes of your choosing – monochromatic, triad, analogous, complementary and more.


Browse colours, palettes and patterns on COLOURLovers or create your very own. Upload a photo and generate colour palette based on it using the PHOTOCOPA tool.


Check out Google Web Fonts, a directory of almost 600 fonts that are ready to use on your website.


Tools for Creating or Editing Your Own Visual Content

Sometimes design involves editing photos and images. Sometimes you just need a high quality screen-shot to include in your PowerPoint presentation. Sometimes you need a good photo editor on your smartphone to improve your Instagram uploads. This is where you'll find the tools that do all of the above.

To save yourself a lot of frustration, make sure you know the image sizing and resolution requirements for the desired publishing channel. For example, you may need to resize an image you first used on your blog to include in a Facebook post. 

Create, edit or manipulate an image using Photoshop-like-editors like Pixlr or Sumopaint.


Take a screenshot of something on your computer screen, and annotate it with text, shapes, and objects using Jing or Evernote's Skitch.


Modify photos or create memes with the Google+ Photo Editor (you have to have a Google+ account to do this).


Create a reusable PowerPoint template with several simple backgrounds that you can easily layer text on top of, then same as a JPEG.


Create infographics in PowerPoint.


Snap and edit photos with one or more of these mobile apps.


Snap and add effects to photos using Instagram, Facebook Camera, or Flickr Mobile.


Create a word cloud with Wordle.net.


ScoopIt logo
Follow our content curation channel, Inbound Digital Marketing with WhiteSpace for daily breaking news!


Flickr Photo Credit: by Madison Berndt

Murray Sye WhiteSpace specializes in helping organizations thrive by leveraging the power of the internet. Our digital marketing and creative agency can help develop strategic and tactical direction to help boost your business.


Post Comment
Website (optional)

Allowed tags: <a> link, <b> bold, <i> italics


Small Canadian agency becomes HubSpot Certified Partner
Business Marketing Toronto
The Business of Email Marketing
Graphic Design for the Web
Internet Marketing
What shapes website design in Toronto
Understanding Social Media Marketing
Internet marketing and search engines