If you are new to Weavely, this guide will help you to grasp the concept of building forms in Figma. You'l see how easy it is, just 3 simple steps.
To start, choose the type of form you want: standalone (a dedicated web page), embedded, or pop-up.
Next, decide how you want to build your form. You can begin from scratch by selecting "blank form," or speed up the process by using our AI assistant to generate a form for you. This tutorial provides a detailed walkthrough of our AI feature. You can also choose from two simple templates.
For this example, let’s go with a blank form. Select your desired form elements and click "generate." The elements will appear in the component library. Copy and paste them onto your form’s canvas. And that’s it for building!
Pro tip: To keep your form responsive, always use the canvas provided by the plugin and apply autolayout. Check how your form looks on mobile, tablet, and desktop in the plugin’s preview mode.
With Weavely as a Figma-integrated form builder, you have full control over your form’s design. In this example, we’ll change the colour of the submit button, background, and radio buttons. But you can do much more — adjust the layout, change fonts, add images, tweak any form element for a unique look, and more.
The final and easiest step is publishing your form. Once you hit "publish," your Figma design instantly becomes a live web form. Now, share it with your respondents!
The best part? You can iterate your form anytime. Need to edit the copy or design? Just make the changes in Figma and re-publish for an instant update.