# Form

The **Form** interface turns your workflow into a standalone web interface where users fill in fields and receive AI-generated results. It is the right choice when you need structured input collection — as opposed to a free-flowing conversation.

<figure><img src="/files/M4yQ5oufGAryjKIBzkKF" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
**When to use Form vs Chat:** Use **Form** when users provide a fixed set of inputs before running the workflow (e.g. "paste your resume + job description → get a cover letter"). Use **Chat** when the conversation itself drives the workflow.
{% endhint %}

### How it works

Each **Input Node** in your workflow becomes a field in the form. When the user submits, the workflow runs and outputs are rendered inline. The form can be customized visually and shared publicly via a link.

### Setting up your Form

1. Open your project in the Workflow Builder.
2. Click **Interface** in the top tab.
3. Select **Form** from the interface options on the right.
4. Click on **Use this interface** at the bottom.
5. Configure appearance, fields, and behavior in the panel on the right.
6. Click **Publish** to make it live. Share the public URL with your users.

### Form Block Settings

Each block in your form can be individually configured. Click the **Edit** button on any block — a settings panel will open on the right where you can adjust the options described below.

#### Input blocks

The Form Block Settings for input blocks are:

* **Label** — the field title shown to the user
* **Placeholder** — hint text shown inside the field before the user types
* **Required / Optional** — required fields block submission until filled

If your Input Node has a fixed set of options, you can also configure the field to render as:

* **Dropdown** — compact single-select list
* **Radio buttons** — all options visible, single-select
* **Checkboxes** — all options visible, multi-select

You can set a **default value** and control the **column layout** (1–3 columns) for radio and checkbox groups.

#### Output blocks

The Form Block Settings for output blocks are:

* **Label** — the label displayed above the output
* **Required** — controls whether the output must be present before the form result is considered complete

### Form appearance

#### Banner

Add a banner image or solid color at the top of the form. Supported formats: PNG, JPG, GIF (max 5 MB).

#### Background

Set a background color or background image for the whole form page.

#### Submit button

Customize the submit button's **label**, **color**, and **icon** to match your brand.

### Custom layout

By default, all input fields are stacked in the order they appear in your workflow. You can override this with the **Layout Editor** — a rich text editor that lets you:

* Add headings, paragraphs, and dividers between fields
* Re-order inputs and outputs
* Intersperse instructions or context alongside form fields

This is useful for multi-section forms or when you want to guide the user through the form with explanatory text.

### Chat with Form

Enable the **Chat with Form** toggle to add a chat sidebar next to your form. Users can ask follow-up questions about their results without leaving the page. The chat assistant has access to the form inputs and outputs as context.

<figure><img src="/files/nefzOYiYnTcVF87hWWzU" alt=""><figcaption></figcaption></figure>

### Sharing

Once published, your form gets a public URL you can share directly or embed. Access control (password protection, allowed domains) is configured in the **Security** tab of the Interface panel.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.stackai.com/interface-and-deployment/end-user-interfaces/form.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.