Community Project: Search Form Results!

This project was a little more spicy than the first; around 40 of you responded to the search form styling challenge last week and we’ve had some interesting interpretations – take a look..

The Challenge

I asked you all to style this simple markup..

<form>
    <input type="search" placeholder="What are you looking for?">
    <button>Search</button>
</form>

..using whatever magic you could muster with CSS alone. Here are the results!

A Couple of Examples

You’re welcome to continue submitting ideas for this, but there’ll be another challenge coming soon. In the meantime, check out a few of the submissions which most caught my eye:

Small Brown Search – by Fabian Pecher

All the way Round – by Amol Mandhane

Natureful Search Form – by Jordan Foreman

Glowing Pulse – by Jack Rugile

SpaceCat – by John Jack

Blur – by Josh Allen

Blue Search – by Ernesto Camacho

Personal Disclaimer

There’s a chance I somehow missed your submission, messed up your name, copied the wrong url to your own site, ruined something I haven’t even thought about – if that’s the case, just shout at me in the comments and I’ll see about setting things right.

Other than that, enjoy everyone’s work and leave constructive advice, questions and thoughts in the comments below. Thanks to all who participated – here’s to many more Webdesigntuts+ Community Projects!