Webflow Custom Forms

:)

The Basics

Webflow Forms are powerful. If you use them in combination with the embed widget they can do even more.
On the left, is a demonstration of all the form elements natively available in Webflow. On the right, are the form elements constructed with the code embed widget. Both sets of fields are in the same form element and will be submitted together.

Native Form Inputs 

Extendable Form Inputs 

Date Pickers
Numbers
Other Feilds

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form :(

A little more advanced

Lets take a look at an example of multi step forms created completely in Webflow.

The first example is a form block with a slider widget embedded in it. I turned the traditional right and left arrows into “continue" and “review" buttons. Because the slider is contained by the form element the form will still function normally.
Keep in mind that it will be hard to manage required fields on previous slides. In the example I kept all the required fields on the last slide.

Step 1 - Basic Info

Step 2 - Select

Step 3 - Register

Step 1
Step 2
Step 3

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form

Price Range Slider

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form