Product

Templates

Resources

Pricing

Support

Product

Templates

Resources

Pricing

Support

Framer Form Academy

Add form Logic

Add form Logic

Show this if they click that. Hide this if they say yes. Logic is where your form starts acting smart.

Make your form a multi-step form

If you haven't turned your form to a multi-step format yet, check out these instructions to see how you can do it. Since the logic works based on form pages, you’ll need to make your form a multi-step one first.

Name each page that will be used for logic

Give each page a unique name for routing purposes.

Add the logic component to a page

Copy the logic component to your form's page. It’s visible only in the editor, not during preview or on the published site.

Add conditions to the logic component

For each condition, specify the input's name, type, condition, value, and the page name to navigate to if the condition is met. Conditions are checked in order when the next page button is pressed.

Add a default page

When none of the specified conditions are satisfied, the form will redirect to the default page indicated in the "Default" option of the logic component. If a default page name isn’t provided, it will navigate to the next page in the sequence. You can repeat these steps for any page where you wish to implement logic.

Feel free to add logic to as many pages as necessary in your form, but ensure that each page contains only one Logic Config component. Pages without a Logic Config will behave like standard multi-step form pages, simply moving to the next page in the list.

Define a list of end pages

If your logic form has multiple ending pages, select the Multi-Step Form component at the top of your form, switch "End Page" to "Custom Pages", and write the names of the ending pages. The submit button is shown and the next page button is hidden on end pages.If your form does not have multiple ending pages, leave end page as "Last Page" and the submit button will only be visible on the last page.

Test your form

Just fill out the form with different values to make sure everything's working right.

GET STARTED WITH FRAMERFORMS

GET STARTED WITH FRAMERFORMS

Building custom forms in Framer has never been easier. Start today.