Designing a responsive form, 20 inspirational solutions

With so many new mobile phones, tablets and other devices coming out every day, designers have to be prepared to make common functions easy to do on these devices. The usual approach to this is responsive design. However, what some of us are still trying to figure out is how to use responsive design for things other than viewing.

Forms are one of the most common elements on the Web, without them the conversation is only going one way. Forms are used for purchasing, contact, and so much more. It’s vital that the forms you produce are equally functional across the full range of devices, from smart phones to desktops. Mastering the art of making these types of functionalities small yet user friendly can be a task.

Today, we’ve found a few responsive web sites that do a great job in keeping their forms both intact and useful not just on desktop, but on mobile too.


Theme Foundry

Order — The Theme Foundry


Emporium Pies 

Order Yourself a Pie! • Emporium Pies • Fine Pies for Fine Folk


Samuel Mealing

Contact Us


Awesome NYC

Awesome – Contact


Ola Kvernberg

Ola Kvernberg - Contact



Symbolset - Turn words into icons using font magic


Built Things

Built | A Furniture & Fixtures Shop In Seminole Heights, FL.


World Meeting Time

World Meeting Time





Moving Things



Nest Protect | Nest


Yellow Marshmellow

Web Design Telford | Web Design Shropshire | Yellow Marshmallow







Kingshill Cars

Kingshill Cars - 01732 871234 - Taxi and Private Car Hire in the Kingshill and Malling area


Stuff & Nonsense

Talk to Stuff & Nonsense



Contact | Humaan – Design, websites and digital solutions for humans


Ony (20131101)


Cafe Evoke 

Contact • Café Evoke // Coffee, Wine, Beer, Eats, and Catering in Edmond & Oklahoma City

How do you prefer to design responsive forms? Are there any other elements harder to make responsive? Let us know your thoughts in the comments.

  • Santosh K. Shah

    Nice collection.

  • JTech

    Some of these are nice, but a fair number of them aren’t really responsive, or just the form is responsive, while the page around it doesn’t scale as well. I think that our contact us form on our website is better than most of the forms on here.

    • Sarah

      While yes yours is responsive, personally I think it lacks the design element that the rest of these forms have.

  • aufche

    inspiring me.. thanks for collect this

  • Isadora Design

    In terms of functionality and responsiveness, I think Emporium Pies nails it.

  • Raj Sethi

    it can be possible to make 1:1 ai file from corel draw x5 or x6
    give me suggestion

  • Efusionworld

    Wow, Nice collection!! All # 20 responsive forms are very useful to build a responsive web design. My vote is for Samuel Mealing which is better than most of others.
    Thanks for sharing this.