Here’s another trio of my favourite creative websites and resources.

This time featuring: Gradients, Colour Palettes and Typography!

Typewolf

Bookmark This 003.1
typewolf.com

a browser window illustration featuring a screenshot of a detail page from the typewolf website

The Typewolf home page ©Jeremiah Shoaf

This website, as the strapline says, shows you what is ‘Trending in Type’. From the homepage you can get inspiration from real world examples and see what font pairings designers are using.

a browser window illustration featuring a screenshot of a detail page from the typewolf website

Typewolf detail page for the Akkurat font ©Jeremiah Shoaf

But! There is so much more to it than that. Click on one of the named fonts and you’ll be presented with a profile page for that typeface. Here you will find a purchase link, a type specimen, fonts that are similar in appearance, the closest matches to be found on Adobe Fonts or Google Fonts, and also a suggested font pair.

Typewolf also has font recommendations by the author, learning resources, and even lists its most popular font profiles which is always interesting.

Color Hunt

Bookmark This 003.2
colorhunt.co

a browser window illustration featuring a screenshot of a detail page from the color hunt website

Color Hunt landing page ©colorhunt.co

Color Hunt has a huge number of hand-picked palettes to help with your design work. You can search for a base colour or peruse one of the prebuilt collections (these have themes such as pastel, neon, or Christmas).

a browser window illustration featuring a screenshot of a detail page from the color hunt website

Color Hunt detail page ©colorhunt.co

Clicking on a palette gives you an expanded view, which shows the colour details and links to similar palettes.

Web Gradients

Bookmark This 003.3
webgradients.com

a browser window illustration featuring a screenshot of a detail page from the web gradients website

A small selection of the available gradients ©itmeo.com

This is a free collection of 180 linear gradients and very pretty they are! In a click you can copy CSS code to apply a gradient to your website, or get an image file of it. There are also downloadable gradient packs for Sketch and Photoshop.


Header Image: by fidaolga on Adobe Stock.