25 Stylish Examples of Web Forms
A web form is the primary mode of permitting users to interact with a website. Whether it’s for signing up to a service, leaving a comment on a blog post, or writing an email through a web-based client such as Gmail – forms are a staple to modern websites and web applications.
In this showcase, you’ll be able to set your eyes on a few remarkable and well-constructed web form designs for inspirational ideas on how to build and design engaging and effective HTML forms.
1. Alexandru Cohaniuc
2. Tea Round App
3. Grooveshark
4. Substrakt
5. Matt
6. Pixelight Creative
7. Ballpark
8. MAQUINA studio
9. nclud
10. MonAssoc
11. Komodo Media
12. AllDevJobs.com
13. Connect
14. TVI
15. Webgrapes
16. Headscape
17. Digg
18. Graphik.fi
19. CollabFinder
20. Digitalmash
21. Kontain
22. SocialSnack
23. Mint
24. BBC
25. Media Temple
Related content
- Five Types of Effective Headers in Web Design
- 25 Great Examples of Using Gradient Effects in Web Designs
- Create a Slick and Accessible Slideshow Using jQuery
- Related categories: Design Showcase / Inspiration and User Interface
This was published on Jun 6, 2009


























47 Comments
tehkubix Jun 06 2009
Really like komodomedia and grooveshark. The comment layout on digitalmash is pretty cool too.
Danh ba web 2.0 Jun 07 2009
Very nice and cool. See more: http://tr.im/nGe3
Roseli A. Bakar Jun 07 2009
This is a great list contact forms Jacob. I should find this list handy in the future.
Jacob Gube Jun 07 2009
@tehkubix: I try to be impartial when putting these showcases together, but I’d have to say that Grooveshark is my favorite one out of the bunch: clean, simple, and very engaging.
@Danh ba web 2.0: Nice showcase, thanks for sharing.
@Roseli A. Bakar: I was designing the interface for a web form about a week ago, which resulted in a massive collection of web forms that I liked and that my friends liked: this showcase is a trimmed-down version of that list, and I hope it helps you quickly find design inspiration for when you need to design a web form.
hadi060 Jun 07 2009
Wow what a great collection! Me too I like very much Grooveshark. Hope find a css tutorial to creat a menu like it :)
Thanks for sharing..
hadi060 Jun 07 2009
sorry I mean a form :)
seriocomic Jun 07 2009
Having some insight into the complexity of these, I thought they are worthy of a mention:
http://www.digithinkinteractive.co.nz/contactus.asp
http://mobygreen.com/contact/
Callum Chapman Jun 07 2009
Nice collection – I need to learn to code!
Keith D Jun 07 2009
Grooveshark is, as you say, clean and simple but Alexandru Cohaniuc is the one for me.
Crumpled paper with sticky tape… very nice.
Trouble is, if I had another look through, I’d pick another favourite.
They are all great for ideas.
Aneslin Jun 07 2009
Really awesome form designs,
thanks a lot.
Rene Zammit Jun 07 2009
Great forms. Nices ideas. Gonna use these :P
Dimas Jun 07 2009
Very nice … I like: AllDevJobs (something about a simple, stylish search box, its just great), CollabFinder and Webgrapes (color and rounded corners always add flair). Good job Jacob, thanks for sharing!
Jim Gaudet Jun 07 2009
F!@#in A man, you are like a mind reader. Today I was going to look for some ideas on login forms and you did it for me.
Sweet, its going to be a great Sunday..
Marc Jun 07 2009
It’s all great looking, but some forms may deter conversion rates because it’s not too obvious how one should interact. Consider your audience and your objective for the page before you design a form.
Om Ipit Jun 07 2009
really inspiring me. i love SocialSnack
Ben Sky Jun 07 2009
Nice collection, heres another interesting one done with jQuery: http://bit.ly/GiAI9
Webgrapes Jun 07 2009
Thanks for including our Contact form! It’s plain simple and we love it :-) Thanks again!
Chris Jun 08 2009
Great examples of an aspect of site design that is often an afterthought.
div Jun 08 2009
Happy to see so many varieties. Looking to C many more additions very soon……
Farid Hadi Jun 08 2009
Thanks for showcasing these nice forms here Jacob. Your timing couldn’t be any better (OK, maybe you could have posted it a couple of days earlier :P ) as I’m currently working on a form on my own site. I hope I can absorb something out of this showcase and do something to improve my form.
Thanks for a great showcase!
webmasterdubai Jun 08 2009
wowo nice collection of forms and good ideas.
Subramanian Jun 08 2009
It is simply superb collection. I have no other words to express.
Chris Wallace Jun 08 2009
@Jacob Good lookin’ roundup of forms. Thanks for putting AllDevJobs on the list!
@Dimas Glad you like it! ;)
Tim Wright Jun 08 2009
Very well put together showcase. I usually don’t like lists like this because they just contain example from the sites we all usually go to, but this one is actually very useful. Thanks!
Rogie King Jun 08 2009
@Jacob, Thanks for putting Komodo Media on the list. A special thanks for including the word “Poppycock” in your screen capture ;]
Monique Jun 08 2009
nice, good ideas. I use a freely available script called PrettyForms.
Raveendran Jun 09 2009
Very good collection. I like it very much.
Jacob Gube Jun 09 2009
@Rogie King: Explain to everyone what “Poppycock” is. :)
David Hellmann Jun 09 2009
nice forms!
here is my contact form: http://www.davidhellmann.com/contact/
Rogie King Jun 09 2009
Sure thing Jacob! Here’s what I lifted from WikiPedia:
PoppyCock Anglicized form of the Dutch pappekak,[1] which literally means soft dung or diarrhea (from Dutch pap pap + kak dung) – is an interjection meaning “nonsense
Ruben Medellin Jun 10 2009
Just to point out, Grooveshark is Flex based, so it somewhat stands out of the web form category. Neat nevertheless.
Big Buddy Jun 10 2009
Thanks for this great list of forms. It certainly is some timely inspiration!
Sameer Khan Jun 19 2009
Its really a great list of forms…I just loved it…I will try to make one of them for me too..
Danielle Jun 27 2009
SocialSnack is very cute :)
Viljami Salminen Jun 30 2009
I’m a bit late, but thanks for including my contact form (graphik.fi) ! I appreciate it.
Fernando Medeiros Feb 13 2010
great web forms!!!
thanks for sharing.
neel Jun 08 2010
Excellent design forms. Nice to use these design trends in this year.
Siddharth Jul 11 2010
awesome work .. Really liked a lot..
Thanks for the share
Chris Jul 23 2010
These forms suck.
Dev Aug 14 2010
too good collection. I disagree with you chris. these are good examples.
Stripeyhorse Sep 01 2010
Yeah some nice stuff there. maybe its time I go back to redesign ours.
Marty McColgan Jan 25 2011
great collection
Vekta Feb 11 2011
A very good collection and great insperation. Forms used to be so dull but utilising jQuery can make forms enjoyable to build.
Paul Jun 14 2011
Excellent collection, think headscape is the nicest.
Divyang Jul 15 2011
Zoho Creator is really great tool to build web forms without writing a single line of code. It supports CAPTCHA and File Upload which are not even supported by Google Docs. If you’re looking for example of how to build web forms, have a look at this guide Zoho web forms builder.
coldfire Sep 08 2011
Keep it up. Good work!
Geoff McMahen Sep 15 2011
Stunning collection of great design ideas, thanks for sharing!