# Building Your First Form

> This is a step-by-step tutorial for building your first form with [UiPath Form Designer](https://docs.uipath.com/activities/other/latest/workflow/getting-started-form-pre-234). The tutorial demonstrates building a generic form.

This is a step-by-step tutorial for building your first form with [UiPath Form Designer](https://docs.uipath.com/activities/other/latest/workflow/getting-started-form-pre-234). The tutorial demonstrates building a generic form.

## Tutorial

This tutorial is an example of a form assessing public opinion on environmental issues, composed of single choice and open-ended questions, and rating scales.

**Prerequisites**

Before you build your first form, make sure to have the [UiPath.Form.Activities](https://docs.uipath.com/activities/other/latest/workflow/about-the-form-activities-pack) package installed.

To build a generic form:

1. Add a **Sequence** activity into your workflow.
2. Add a **Create Form** activity into the **Sequence**.
3. Select **Open Form Designer**. The **UiPath Form Designer** opens.
4. Add a **Label/Header** component in the form.
   1. Choose **Header-Medium** from the **Label Size** dropdown list.
   2. In the **Content** section type `Environmental Issues Survey`.
      :::important
      Make sure to save each component after editing it.
      :::
5. Drag and drop a **Radio** component in the form.
   1. Rename the **Label** as `Do you want to participate in the survey?`.
   2. In the **Data** tab, inside the **Values** section, add two values for the component. Type in the **Label** field `Yes`.
   3. Click the **Add Another** button and then type in the **Label** field `No`.
6. Add another **Radio** component into the form.
   1. Rename the **Label** as `How concerned are you about air pollution?`.
   2. In the **Description** section, type `You can choose one option only`, to let the users know that they can choose one option only.
   3. In the **Data** tab, inside the **Values** section, add four values for the component. Type in the **Label** field `Not at all concerned`.
   4. Click the **Add Another** button and then type in the **Label** field `Slightly concerned`.
   5. Click the **Add Another** button and then type in the **Label** field `Moderately concerned`.
   6. Click the **Add Another** button and then type in the **Label** field `Very concerned`.
7. Drag and drop a **Text Area** component in the form and rename the **Label** as `What is your opinion on how the government tries to reduce global warming?`.
8. Drag and drop a **Number** component in the form and rename the **Label** as `Please type in your age:`.
9. Save the form and run the workflow to test your first form.

   ![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-183673-37442ac2.webp)

See the [About Form components](https://docs.uipath.com/activities/other/latest/workflow/about-form-components) page to learn more about types of components and how they work.

## Preview your first form

To preview your form, click the **Preview** ![](https://dev-assets.cms.uipath.com/assets/images/activities/activities-image-preview_form_icon_screenshot-59464e26.png) icon, in the **Form Designer** ribbon.

To resize the display size (in pixels) of the form, go to the **Form Display Size** section and change the values for the **Height** and **Width** measurements.

   ![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-181064-9689187d.gif)

To exit the Preview mode, click **Exit Preview** in the **Form Designer** ribbon.

## Select and customize themes

To select a premade theme:

1. In the Preview mode, go to the **Themes** panel.
2. Select one of the existing premade themes.

To customize a premade theme:

1. In the Preview mode, go to the **Themes** panel.
2. Select **Customize Current Theme**.
3. Customize the form and the primary button using the available options.
4. Select **Save Customization**.

  <iframe
    src="https://documentationpicturerepo.blob.core.windows.net/videos/Forms/Customizing_first_theme.mp4"
    title="Accelerate building automations with UiPath Integration Service"
    style={{
      position: "absolute",
      top: 0,
      left: 0,
      width: "100%",
      height: "100%",
      border: 0,
    }}
    loading="lazy"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
    referrerPolicy="strict-origin-when-cross-origin"
    allowFullScreen
  ></iframe>

## Sample Workflow

To check the complete workflows or to have a future reference, download the [XAML examples](https://documentationexamplerepo.blob.core.windows.net/examples/Forms/Building_Your_First_Form.zip)