Embed forms on Framer

Place a form on a Framer site through Framer's Embed component, in HTML mode with the snippet or in URL mode with the framed address.

Framer is a visual site builder: you design on a canvas and publish a responsive site without writing code. A form built with Tinyform can sit on any Framer page, so the page keeps Framer's design and the form keeps everything the editor gives it, from conditional logic to file uploads.

There is no Framer plugin or component of our own. Framer's built-in Embed component is the whole integration, and it is enough.

How to embed a form in Framer

1. Publish the form and copy the embed

   Publish from the editor, open the Share tab, and under Embed Form choose Standard. Get the code shows the HTML snippet; Copy embed link copies the framed address, /embed/<id>. Either one works in Framer, so take whichever the next step asks for.

2. Add Framer's Embed component

   In Framer, open the insert panel and add an Embed element to the page where the form belongs.

1. Paste the snippet or the address

   The Embed component has two modes. In HTML mode paste the Standard snippet. In URL mode paste the /embed/<id> address. The HTML route is the one to prefer: it loads the widget script, which is what lets the frame grow and shrink with the form.

1. Place and size it on the canvas

   Drag the element to where the form should sit and give it the width of its column. Height takes care of itself as long as Dynamic height is on in the embed options, which it is by default.

1. Publish the Framer site

   Publish and open the live page. Answers arrive in the form's Submissions tab; the Framer page only hosts the frame.

Related guides

• Create Framer forms
• Create a multi-step form in Framer
• Create forms with conditional logic in Framer
• Create forms with file upload in Framer
• Embed your form, for what each embed option does