Skip to main content

Documentation Index

Fetch the complete documentation index at: https://formhug.ai/docs/llms.txt

Use this file to discover all available pages before exploring further.

Framer’s Embed component lets you place a FormHug form anywhere in your site layout. The form adapts to Framer’s breakpoints automatically, so it looks right on desktop, tablet, and mobile without extra configuration. Embedded forms work well for lead generation, waitlists, product feedback, and contact forms.

​
Before You Start

Get your embed code from FormHug: open the form → click Publish → Embed → copy the code.

​
Add the Form to Your Page

1

Open Your Framer Project

Open Framer and navigate to the page where the form should appear.
2

Insert an Embed Component

Click + in the toolbar → search for Embed → drag the component onto your canvas.
3

Paste the Embed Code

Select the Embed component, then paste your FormHug embed code into the HTML field in the right panel.
4

Set the Width to Fill

In the layout settings, set the width to Fill (or 100%) so the form stretches to fill its container at every breakpoint.
5

Set the Height

Set a fixed height that fits your form. For a short contact or sign-up form, 450–550px is usually right. For longer forms, use 700px or more. Check after publishing and adjust if needed.
6

Publish the Site

Click Publish in the top bar. The form is live on your Framer site.

​
Control the Maximum Width

Most forms look best at a constrained width rather than spanning the full screen. Place the Embed component inside a Frame with a max-width set — 560–720px works well for most form types. 
Frame (max-width: 720px, centered)
└── Embed (width: Fill, height: 550px)
Switch between breakpoints in Framer’s preview (Desktop → Tablet → Mobile L → Mobile S) and check the form at each size. If it looks cut off at a smaller breakpoint, increase the height for that breakpoint in the layout panel.

Embed Options

All embed types available in FormHug

Embed in Webflow

Instructions for Webflow sites

Lead Generation Templates

Start from demo, quote, callback, and early-access forms
Last modified on May 15, 2026