We all know the importance of typography in just about all media. The style of typography used can say a lot about the market or target audience of the business or organisation. It is paramount in good web design to get the typography right, or at the very least, suitable.
Hand-drawn or calligraphic typography certainly does not suit every business, but it can be extremely effective where it does suit. This round-up features website designs that use this style of typography to maximum effect.
Hand-Drawn and Calligraphic Typography in Web Design
Satoshi Kuroda is a film art director. He uses large graffiti style typography on the landing page of his site, placed on a patterned transparency over an animated background.
New York Summer
This site is a report on Jake Blakeley’s visit to New York. Using vector illustrations and a hand-drawn font for the title, the whole site is quite minimal in design.
I Want My Startup
This is a job board for ‘startuppers’. Their landing page has some scrolling large headline text and a static background with vivid green hand-drawn typography.
Kev Adamson uses a lot of hand-drawn typography on his site which is presented in quite a grungy style.
A touch of yellow calligraphy on the very dark color scheme of this site gives it a touch of elegance.
A very minimal presentation here with very little on the landing page, but large hand-drawn typography making a statement that this digital art director has been doing this for over 10 years.
Publik Coffee Roasters
This site uses a couple of calligraphic fonts – the one for their logo and another for headings throughout the site.
This confectionery company uses a very clean and readable hand-drawn font throughout the site.
This producer of beetroot uses a casual hand-drawn font for both the labeling of its products and throughout the website.
Hublot Loves Football
Hublot is the company that provides timekeeping for soccer around the world. They have words and small phrases in a hand-drawn font throughout the site, and the Hublot Loves Football logo uses the same font.
This Japanese music promotion site has some wonderful hand-drawn or hand-created typography on the landing page. All music related, the whole page is animated and just in case you have a problem reading it, it says ‘Good music is good business’.
For as long as I can remember, Amazee Labs have been using the same calligraphic logo. Their landing page currently has a photograph of a guy sitting on a sofa with (we make) Fresh Drupal Websites that appears to be created in blue tape on the wall behind him.
This French wine producer uses both calligraphy and some handwriting on the landing page. The calligraphy is the design of their logo, and the hand-drawn lettering (which I believe is actually his handwriting) is a quote by the proprietor.
Expand – Business
This site uses a sketchy hand-drawn upper case font for its main headline text on the landing page. A hand-drawn cityscape image with animated clouds and presented in pastel colors help to add a feeling of minimalism to this site.
Shoot For The Moon
This is the portfolio site of Swiss web designer Marcelo Gil. The site design was inspired by the 1902 movie called Le Voyage dans la Lune. A very nice hand-drawn font is used for the title on the landing page, and again at various places throughout the site.
This is a cool idea… the company hires out beautiful china products such as cups and saucers, plates, etc… and the full cost of the hire is donated to the Tiyamike Children’s Home in Malawi. The company is located in Wales. They use a watercolor-stroke font, with similar underlines for each header – which are also in a hand-drawn font.
This site has a beautifully presented landing page with white hand-drawn calligraphy on a black background, giving a chalkboard effect.
This French art director/illustrator uses a seriously beautiful piece of hand-drawn calligraphy for the site name in the center of the landing page.
This site uses all hand-drawn elements on the landing page, including the slightly animated title in a beautiful, slightly grungy font.
Creatures & Features
This site offers you to create your own creature for printing on a T-shirt. The landing page is a mainly black and white color scheme, with lots of sketches and some hand-drawn fonts making it a really busy page. However, the blue CTA button in the center of the screen stands out beautifully.
A few years ago this style of typography was seriously trending – more recently, it is one of the many trends that didn’t completely die out, but really has reduced in popularity among designers. This makes sites that are still using such a style like a breath of fresh air when you find the ones that are perfectly put together.
Have we missed any sites that you think should have made this list? Please share your links and opinions with us in the section below.