20 Excellent Examples of Forms in Web Design

By / Apr 18, 2011 / Inspiration
shares

As we can find on Wikipedia, “Form refers to the shape, visual appearance, or configuration of an object.” And here I believe that this is also the perfect explanation… forms in web design are a way to gather information, but they must also take on a “form” or an appealing visual appearance in order to be effective. So we decided to gather some fresh examples of websites that have well designed forms. From registration to contact and login forms, you will see some very inspiring examples.

EEHarbor

EEHabor offers ExpressionEngine goods, so forms are probably their expertise.
The website itself is really beautiful and clean. The register form is clean, beautiful and straight forward, it is certainly a form that will not scar you away.

forms01
forms02

Contrast

Contrast is a web apps developer. Their website is pretty unique and nice, good usage of typography, colors and shapes. The contact form is also pretty unique and fun.

forms03
forms04

SVN2FTP

SVN2FTP is a hosted source control system. The website has a nice fun approach and a beautiful texture. The contact form is also nice and different from usual.

forms05
forms06

Ally Creative

Ally Creative is a small creative company. Their website is clean and have a nice textured background, the contact form is also pretty nice.

forms07
forms08

Think Vitamin Membership

Think Vitamin is a nice place to watch videos to learn web design and development. Besides having a nice website, all their forms are beautiful and pleasant.

forms09
forms10
forms11

Scribble & Tweak

A beautiful and neat single page layout that holds a nice and easy contact form.

forms12
forms13

Barnt & Arnst

I know I already showcased this website in previous lists, but I really like its colors and simple layout. And they deserve and extra point for their super clean contact form. ;)

forms14
forms15

The Bullitt Agency

Nice website layout based on shades of black, gray and some beiges. Beautiful background images and classic contact form.

forms16
forms17

Atlason

Clean and beautiful layout with “built in” forms for FTP and email.

forms18

Major Tom

Nice image based layout with a “hidden” sign in form for clients.

forms19
forms20

Blind Pig Design

Their website is really cool. And as for the contact form, pretty classic and clean. Also loved the subject detail from the contact form – Oink!

forms21
forms22

Clyde Quay Wharf

A residential project from New Zealand with a layout based on beautiful background images and elegant type choices. The “register your interest” form is pretty clean and beautiful.

forms23
forms24

37 East

If you are thinking about doing the real African Safari, you should check out this website. The layout is based on really beautiful background images and interesting typography.

forms25
forms26

Michael Freimuth

Michael Freimuth is a art director and illustrator. His website is pretty simple and cool. The login form to browse archives is also really nice.

forms27
forms28

Social Design House

Their website has delicate colors combination and a good choice of typography. The contact form is also pretty beautiful.

forms29
forms30

Tinkering Monkey

Besides having some pretty stylish products to sell, Tinkering Monkey has a super clean layout. The contact form is also pretty neat.

forms31
forms32

Go Live!

Need a button to shout about your work? Try this! Go Live has a pretty colorful layout and their “let’s do it form” is also really nice.

forms33
forms34

Sophie Hardach

A cool single page layout for a book website. Contact form really unique.

forms35
forms36

Soapbox

Simple layout with a beautiful color scheme.

forms37
forms38

RxBalance

Beautiful watercolored layout with texture background. Delicate colors and typography. The contact form is also really elegant and simple.

forms39
forms40

Source:

The Best Designs
siteInspire
Unmatched Style

About the Author

Gisele Muller loves communication, technology, web, design, movies, gastronomy and creativity. Web writer, portuguese/english translator and co founder of @refilmagem & @mentaway Twitter: @gismullr

16 Comments

  1. Jatin
    April 18, 2011

    I personally found design of ‘SVN2FTP’ website quite interesting and eye-catching too. Others examples are okay-okay for me.

    BTW, Nice article Gisele.

    Reply
  2. Spike
    April 18, 2011

    A bunch of contact forms are no help to anyone. What about examples of complex web forms from web applications.

    It’s too easy to make a nice looking form when it only has text inputs!

    Reply
  3. Dave
    April 18, 2011

    Its great to see how forms have evolved over the years, when I started in web design all the forms looked the same and there was no styling or attempt to make them look different. These are a great selection of how that has changed. Nice selection

    Reply
  4. Tristar Web Design
    April 18, 2011

    I agree, I think the ‘SVN2FTP’ form is really interesting and clever design, I like the clean style of ‘Think Vitamin Membership’. Id love to know how to incorporate a ‘send’ button like on ‘Social Design House’ Im guessing its a big image button directly underneath the message box, correct me if i’m wrong though.

    Reply
  5. Mo
    April 18, 2011

    Sophie Hardach’s contact us page is very unique. Good list. Thanks!

    Reply
  6. Andrew
    April 18, 2011

    I’m really impressed by the form on Sophie Hardach’s website. Very creative. Thanks for posting.

    Reply
    • jonah
      August 15, 2011

      thanks andrew.

      it was fun building sophiehardach.com without a doubt.

      it’s actually up for Best Site of The Year at the netawards… not sure how that happened, and i’ve got to say i’m pretty excited:)

      Reply
  7. bob marteal
    April 18, 2011

    The Sophi Hardach and the SVN-2-FTP forms are really inspiring. They are make filling out a web form interesting and enjoyable. Feels more personal and memorable.

    Reply
  8. Tim Somers
    April 18, 2011

    Does anyone else get completely lost on Contrast?

    I appreciate that they probably build good web aps, but web design isn’t one of their strong suits, I’m guessing.

    Reply
  9. JNsites
    April 18, 2011

    Great post and some nice inspiring work, thanks for sharing.

    Reply
  10. designbyarm
    April 24, 2011

    nice post they give me an inspiration for do a new work of web design

    Reply
  11. Patrick M.
    April 23, 2012

    Very nice collection. I will use some for inspirations to build some awesome forms!

    Reply
  12. Greatwhite
    July 2, 2012

    Thanks for sharing.
    These forms are really great examples to inspire website designers.

    Reply
  13. MattWest
    April 3, 2013

    Wow, inspirational stuff. A great tool for being remembered is http://www.sendola.com/. It lets visitors send your contact details straight to their phone via sms. easy to use, and completely free.

    Reply
  14. Howard Steele
    June 24, 2013

    I vote for SVN2FTP :) looks so exceptional!
    Thanks for sharing!

    Reply
  15. Greg
    November 6, 2013

    Always happy to see some good expamples of creative ways of using forms. Hopefully more people will subscribe to more functional/creative use of forms that engage the user, rather than boring them out to death. That’s what I am trying to create for my clients as well http://www.formsdesign.com.au

    Reply

Leave a Reply