Using Handwriting in Website Designs | How to + Examples

Read the full post

Add to Flipboard Magazine.

Using handwriting in website designs isn’t something new since most designers produce their first sketches as paper prototypes anyway. The handwritten trend has gained some popularity in the past few years, because it adds a unique, custom-made feel to a website.

More and more designers have started to incorporate handwritten fonts in logos and websites, and we selected some great examples that teach you how you can successfully do this as well.

These websites belong to various niches and use handwriting in different ways. See how you can use handwriting in website design as well by checking out our hand-picked examples below.

J. Crew Newsletter

Make it bold. | This newsletter uses a casual handwritten font to catch the readers attention regarding the sales offer. It definitely makes the design stand out.


Sewage Free Seas

Use grungy textures on fonts. | This website uses a large typography element on the homepage with a grungy texture overlaid to it. It looks interesting and adds some nice details.


Nicholas Moegly Portfolio

Use handwritten elements in portfolios. | This will add a more personal touch to your portfolio and also how your drawing / typography skills.


The Estate Trentham

Experiment with hand-drawn doodles. | This will support the main content of the site. You can place sketches on the background of the site.


Rufus & Murdog

Use handwritten logos. | This website has an overall modern design but uses a handwritten font for its logo. It adds a nice, custom feel to the whole design.


Lines Conference

Use striking visual elements. | This website has a wild, vivid, colorful and innovative design approach.


Quit for you, quit for them

Use handwritten fonts for a more personal, emotional and informal atmosphere. | This website delivers a powerful message in a friendly manner and the font choice makes it feel more personal.


Frankie says Relax-mas on

Show your creativity. | Hand-drawing is a frequent skill of graphic artists, designers, and illustrators and is associated with creativity and inspiration. Combine it with contemporary techniques and you’ve got a recipe for success!


Fashion Newsletter

Combine sans serif or serif fonts with handwritten ones. | This will make your text stand out and emphasize your message.


The Portrait Machine

Combine drawings with handwritten fonts. | This website does it quite masterfully. It combines hand drawn illustrations with a lovely, all-caps handwritten font.


HtO Surfshop

Make it unique. | This isn’t your usual handwritten font style. Make your handwritten elements truly unique if you want to stand out from the crowd.


Island Collective

Use it to deliver your most important message. | use handwritten fonts to deliver powerful messages to your visitors and readers.


Miki Mottes

Make radical design decisions. | Let your visitors explore their imagination and challenge their creativity through your design.


Skylark Learning LTD

Make it cute. | If you want to create a cute design, the handmade, handwritten style is your go-to web design trend.



Make it elegant. | Give your website an elegant touch by combining a fluid type of font with a regular one.



Decorate it! | You can embellish your handwritten fonts and make them perfect to be used on headers or headings.


The Conference

Emphasize what’s important. | Emphasize the words that deliver the strongest message with some handwritten fonts.


Denise Chandler

Bold and unusual. | You don’t have to use thin, elegant, cursive handwritten fonts. you can opt for a bold, strange font which will surely stand out.



Use it to emphasize some words in a title. | See how amazing the effect is in the titles from the website example below.


The Prince Ink Co.

Use it for headings. | You can use custom-made handwritten elements for the headings on your website.

20-The-Prince-Ink-Co Using Handwriting in Website Designs

  • 187
100 HD Blurred Backgrounds

Join the mailing list to have new content delivered straight to your email inbox. Every subscriber gets a free pack of 100 HD Blurred Backgrounds + bonus 10 realistic web shadows.

100 HD Blurred Backgrounds

Written by Iggy

Iggy is a designer who loves experimenting with new web design techniques collating creative website designs. You can follow Iggy on Twitter.

No Comments

Leave a response