> ## Documentation Index
> Fetch the complete documentation index at: https://docs.softr.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Typeform

> Integrating Typeform with your Softr app.

In this tutorial, we'll go through the process of adding a [Typeform](https://www.typeform.com/) form on a Softr app.

## Getting the form embed code

In your Typeform account, open the form that you want to add to your site, and hit **Share** in the top navbar.

<Frame caption="Share form">
  <img src="https://mintcdn.com/softr-2b8a27e1/DJS8L7o0khZLiLBC/integrations/images/typeform/image1.png?fit=max&auto=format&n=DJS8L7o0khZLiLBC&q=85&s=0d69a232f94d06d086c0b1ff47290a9c" alt="Share form" width="1184" height="604" data-path="integrations/images/typeform/image1.png" />
</Frame>

Further on, you need to choose the **embed mode**, and you can also configure the design and some advanced settings (each mode has its specific settings).

<Frame caption="Embed mode">
  <img src="https://mintcdn.com/softr-2b8a27e1/DJS8L7o0khZLiLBC/integrations/images/typeform/image2.png?fit=max&auto=format&n=DJS8L7o0khZLiLBC&q=85&s=0662e2f68533ddafba47a326fa4ef6cd" alt="Embed mode" width="1238" height="660" data-path="integrations/images/typeform/image2.png" />
</Frame>

As soon as the embed is ready, hit the **Get the code** button and copy the embed code, which you'll then need to add to your Softr app. The next section shows how to add the embed code for all the modes except the **Full-page** mode. For adding a **Full-page** code, please proceed to the corresponding section further in this article.

## Adding the Embed Code

The embed code can be added inside a [Custom Code](/custom-code/3idxDhKqz1qPdqBuWbs61G/custom-code-block-overview/6XNrxFopUEiwbWipq81Eq1) block. You just need to paste the code inside the block as shown below.

<Frame caption="Adding embed code inside the Custom Code block">
  <img src="https://mintcdn.com/softr-2b8a27e1/DJS8L7o0khZLiLBC/integrations/images/typeform/image3.gif?s=01ede0355ea2c1f4c0582e4fa14528d8" alt="Adding embed code inside the Custom Code block" width="2880" height="1420" data-path="integrations/images/typeform/image3.gif" />
</Frame>

## Adding a Full-Page Embed Code

If you want to add a Full-page Typeform embed, you can use the [Custom Code](/custom-code/3idxDhKqz1qPdqBuWbs61G/custom-code-block-overview/6XNrxFopUEiwbWipq81Eq1) section inside **Page Settings**. Just paste the code inside the **Header** or **Footer** area.

<Frame caption="Adding the code to a page">
  <img src="https://mintcdn.com/softr-2b8a27e1/DJS8L7o0khZLiLBC/integrations/images/typeform/image4.gif?s=e3fefc4fd4581f59919916025cf39761" alt="Adding the code to a page" width="2880" height="1420" data-path="integrations/images/typeform/image4.gif" />
</Frame>
