Technique for creating a hand drawn website style

We first got into the blogging world with our website blog “We Are not Freelancers“. The site is a combo of the “Ten Pixel Method” and hand drawn characters and letters.

hand drawn font

A lot of people who we have met say they wish they could create something similar but will not because they can’t draw.

We say anyone can draw if you use a simple technique.

David gives you a quick lesson on how to create a hand drawn website using the ‘don’t lift the pencil‘ technique.

Hand drawn technique video tip

Brought to you by: From-The-Couch

Supporting Elements

There are also few more hand drawn elements within the footer and header design.

hand drawn elements

Share post on facebook

Author of this post: David Perel

David Perel is the founder of South African web design company 'OBOX-Design'. He is also a co-host of the Web 2.0 Show 'From the Couch' and designer/author of the blog 'We Are not Freelancers'. David enjoys giving his opinion on anything happening on the web and is often not shy of speaking his mind online. See all posts by: David Perel

37 Comments (Leave a Comment)

  1. Its great to have everyone who loves art possible to go into any site and understand and learn new things about drawing and paintings, thank you for this post.

    Reply
  2. Great articles & Nice a site

    Reply
  3. I found your blog when I was searching on google, and it brought me right to what I was looking for. I’m going to add your rss feed to my Google Reader, I look forward to reading more of your thoughts

    Reply
  4. thank you for posting do you have feed here? I’d like to subscribe

    Reply
  5. Hi, i must say fantastic site you have, i stumbled across it in Yahoo. Does you get much traffic?

    Reply
  6. This is a wonderful idea. I am sure many people will find this useful. Singapore Photography

    Reply
  7. This is a wonderful idea. I am sure many people will find this useful. Singapore Photography

    Reply
  8. I don’t comment on blogs too often, but I like this post and theme – just wanted you to know that!     
    Thanks! 
    Thank You Note Wording

    Reply
  9. I have numerous troubles with my web browser LYNX on your website. The chimpanzees are still in the page :-(.

    Reply
  10. I love hand drawn stuff. And you really have a nice and useful video here. These hand drawn websites really look awesome and I really hope that this trend will hold its own and is not going to be just a phase.

    Reply
  11. Great little video, this has inspired me to create a hand drawn website.

    Creare Web Design´s latest blog post..How to do rounded corners in CSS 3 video

    Reply
  12. Nice tutorial

    We did a similar thing for a free Wordpress template – it’s up on the Wordpress theme directory – http://wordpress.org/extend/themes/scribblings

    The font used is Pointy – love this font – gives it that scruffy “drawn with a biro” type look

    Reply
  13. nestleomega

    the video loads like snail…possible for a download link?

    Reply
  14. The hand drawn style has been very popular lately, and rightfully so – it can look awesome. The real matter will be to see how it stands the test of time. Is this going to be a phase, or will this trend hold its own? Only time will tell…

    Either way, nice post!

    Shay Howe´s latest blog post..Japanese Web Design

    Reply
  15. Hand drawings are everywhere and they look great on websites. Using hand drawn design elements gives a website a unique look and personality. Nice list you have here!

    Reply
  16. Hi,

    Very useful tips. I am learning web designing and graphics designing. I will help us. Thanks

    certblog´s latest blog post..Become a Successful Professional with MySQL Certification

    Reply
  17. Dunno why, but I have always imagined that hand drawing is something hard to do. Well, it doesnt look that way no more. Thanks for a nice tutorial ;]

    Reply
  18. It worked for me and it gives a familiar look.

    thinkflick´s latest blog post..Best Web 2.0 Graphics Generators

    Reply
  19. I love this look on a website. It gives it more of a personable look and feel.

    Reply
  20. I always wanted to create a website with a handrawn vibe.
    the designs looks very natural and very unique. great post!
    thanks for sharing this one out.

    Reply
  21. @Zach – Great stuff. I hope you come up with something awesome!

    @Srikanth – Glad you liked it!

    @Nic – Pleasure ;)

    Reply
  22. Nic

    Thank you so much! It’s great to see something simple and different.

    Reply
  23. Srikanth.Kavuri

    Hi, I am a 3d artist.This tutorial on line drawing was really great,
    a good start up to become an artist, it helped me to start drawing, I need a perspective drawing i hope i can get a video on this.
    Thank u
    How to download this video ?

    Reply
  24. I nice insight into another way of creating graphics for a web site. I am not a big fan of their type of drawing but, it does move away from what everyone else is doing. I’ll try to implement the technique into one of my future projects.

    Godserv´s latest blog post..Time Is Almost Up

    Reply
  25. Thanks for this! You’ve inspired me to dust off my Wacom and get to drawing. It makes line art a whole lot easier!

    Zach Dunn´s latest blog post..22 Well Done State Tourism Websites

    Reply

Leave a Reply

CommentLuv Enabled
Website Templates Wordpress Hosting

Facebook Fan Page

Monthly Archives

Site Sponsors

Design Shard Flickr Group

Mind the Body!Absolut Vodka Ad.Annapurna Expedition 1970EverythingBjörkCole me on the panny sty.funky grannyfunky doodle like 9The Shinslove