Designing a Responsive Form, 20 Inspirational Solutions

Kendra Gaines By Kendra Gaines  |  Feb. 19, 2014

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.