> For the complete documentation index, see [llms.txt](https://docs.facephi.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.facephi.com/docs.facephi-en/products/idv-suite/flujos-and-integraciones/integraciones-no-code-low-code/integraciones-low-code.md).

# Low-code integrations

The Low-Code integration allows you to incorporate a verification flow directly into your own web or mobile application. Unlike the No-Code integration, here the client manages the experience in their channel, while IDV Suite orchestrates the flow logic from the platform.

The result of the setup process is an **Integration ID** that your technical team will use to initialize the SDK Web or Mobile and execute the flow.

{% hint style="info" %}
**When should Low-Code be used?** Ideal when you need native integration into your web or app, greater control over the UX, or connection with the client's internal systems. It requires a basic technical profile for SDK implementation.
{% endhint %}

***

### Prerequisites

Before creating a Low-Code integration, make sure you have:

* Access to the module **Flows & Integrations** in the IDV Suite platform.
* A **published Flow** in the Flow Designer (with its Workflow ID).
* A technical team that will carry out the SDK implementation in the client's channel.

***

### Create a Low-Code integration

From the module **Flows & Integrations**, click **+ New integration**. In the type selection modal, choose **Low Code** and click **Continue**.

<figure><img src="https://865101184-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUo71Qbj6jZQDavjc0U5X%2Fuploads%2Fgit-blob-51d0774d8fd2a40d03826665f243211602b31009%2FLowCode_1.png?alt=media" alt=""><figcaption><p>Integration type selector — Low-Code vs No-code</p></figcaption></figure>

Next, select the published flow you want to associate with the integration. Only flows in **Published** status will be available.

<figure><img src="https://865101184-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUo71Qbj6jZQDavjc0U5X%2Fuploads%2Fgit-blob-8240bf8afa6320c8f479baeb03e50e9cf4a56651%2FLowCode_5.png?alt=media" alt=""><figcaption><p><em>flow selection modal</em></p></figcaption></figure>

Once confirmed, the integration will be created with an automatic name such as `XXXXXXXX` and will remain in **Draft**. The setup process has four steps: **Choose → Customize → Connect → Configure**.

***

### Visual configuration (Customize)

The **Customize** tab lets you adapt the appearance of the Flow to the client's visual identity. Changes are reflected in real time in the **Preview**, which shows how the experience will look on the end user's device.

<figure><img src="https://865101184-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUo71Qbj6jZQDavjc0U5X%2Fuploads%2Fgit-blob-3d3a2a10442896773aa70eb9984fa2b7d2250093%2FLowCode_2.png?alt=media" alt=""><figcaption><p>Customization screen: color selection</p></figcaption></figure>

Unlike the No-Code integration, Low-Code customization includes a more complete color palette, organized into three groups:

#### Primary colors

| Field          | Required | Description                                                |
| -------------- | -------- | ---------------------------------------------------------- |
| **Primary**    | ✅ Yes    | Primary interface color: buttons and highlighted elements. |
| **Secondary**  | ✅ Yes    | Secondary color to highlight content or buttons.           |
| **Background** | ✅ Yes    | General background color of the experience.                |
| **Neutral**    | ✅ Yes    | Neutral color for background elements or secondary text.   |
| **Accent**     | ✅ Yes    | Accent color for secondary elements.                       |

#### Status colors

| Field       | Required | Description                                     |
| ----------- | -------- | ----------------------------------------------- |
| **Error**   | ✅ Yes    | Color to indicate errors in the flow.           |
| **Success** | ✅ Yes    | Color to indicate successfully completed steps. |

#### Text colors

| Field           | Required | Description                            |
| --------------- | -------- | -------------------------------------- |
| **Title text**  | ✅ Yes    | Color of the screen title or sections. |
| **Body text**   | ✅ Yes    | Color of the main text.                |
| **Button text** | ✅ Yes    | Color of the text inside SDK buttons.  |

{% hint style="info" %}
The panel **Preview** shows both the success case and the error case of the flow simultaneously, reflecting in real time how the configured colors will look in the end user's experience.
{% endhint %}

{% hint style="warning" %}
All colors must be entered in valid hexadecimal format (`#RRGGBB`). Incorrectly formatted values will prevent the settings from being saved.
{% endhint %}

Once the appearance is configured, click **Next step** to continue.

***

### Webhook configuration (Connect)

The step **Connect** allows you to configure a webhook so that your backend receives real-time notifications about Flow events (start, OCR, validation, final result, etc.).

This step is **optional**. If you don't need real-time notifications, you can jump directly to **Configure**.

<figure><img src="https://865101184-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUo71Qbj6jZQDavjc0U5X%2Fuploads%2Fgit-blob-1baf0961bfc9b6d8f65cf55c073e44e1c09f969e%2FLowCode_3.png?alt=media" alt=""><figcaption><p><em>Connect screen — webhook disabled and enabled with visible fields</em></p></figcaption></figure>

When you turn on the **Webhook**, the configuration fields will appear:

| Field                    | Description                                                                                                                                       |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------- |
| **URL**                  | Endpoint of your backend that will receive the events.                                                                                            |
| **Webhook header**       | Custom headers (key/value) to authenticate or identify the calls.                                                                                 |
| **OAuth Authentication** | Enable OAuth authentication on the webhook.                                                                                                       |
| **Health URL**           | Endpoint status check URL.                                                                                                                        |
| **Events**               | Select which events trigger the webhook: `Start`, `Change of Steps`, `OCR`, `Assets`, `Passive Liveness`, `Facial Matching`, `Operation Results`. |

{% hint style="info" %}
Detailed documentation of the payload for each event and the structure of the notifications is available in the section [**Webhooks**](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/webhook.md) of this documentation.
{% endhint %}

Click **Next step** to continue.

***

### App configuration (Configure)

The step **Configure** is where the Low-Code integration differs most clearly from No-Code. Instead of generating a public URL, here you define the parameters that your app's SDK needs in order to execute the flow correctly.

<figure><img src="https://865101184-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUo71Qbj6jZQDavjc0U5X%2Fuploads%2Fgit-blob-9721e4e207fd9c005b31f1633505fa542da65647%2FLowCode_4.png?alt=media" alt=""><figcaption><p><em>Configure screen — Language, Platform, and Bundle ID fields</em></p></figcaption></figure>

| Field         | Required | Description                                                                                                                                                       |
| ------------- | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Language**  | ✅ Yes    | Main language of the Flow (`Spanish`, `English`, etc.).                                                                                                           |
| **Platform**  | ✅ Yes    | Client app platform: `Android`, `iOS` or `Web`.                                                                                                                   |
| **Bundle ID** | ✅ Yes    | Unique identifier of the mobile application (for example: `com.empresa.app`). Required to validate that the SDK executing the flow belongs to the authorized app. |

Once the fields are completed, click **Finish integration**. The integration will move to the **Configured**.

{% hint style="info" %}
Once the setup is complete, the **Integration ID** will be available in the integration list. This identifier is the key piece your technical team needs to initialize the SDK and link the app with the flow defined on the platform.
{% endhint %}

***

### Available statuses and actions

From the list of **Integrations** you can see the status of each integration and the available actions.

<figure><img src="https://865101184-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUo71Qbj6jZQDavjc0U5X%2Fuploads%2Fgit-blob-d77ed9e3433bc5bace13ef0839c60112c1c809c2%2FNoCode_8.png?alt=media" alt=""><figcaption><p><em>integration list with Low Code badge and visible Integration ID column</em></p></figcaption></figure>

| Status           | Description                                           | Available actions                  |
| ---------------- | ----------------------------------------------------- | ---------------------------------- |
| **Draft**        | In configuration. Not externally accessible.          | Edit flow · Edit settings · Delete |
| **Configured**   | Configuration completed, pending publication.         | Edit flow · Edit settings · Delete |
| **Under review** | Publication request sent, pending approval.           | — (no actions available)           |
| **Published**    | Active and operational. The SDK can execute the flow. | Edit settings · Unpublish          |

{% hint style="info" %}
Unlike the No-Code integration, the Low-Code integration does not have the **Play** action once published, since flow execution happens in the client's application through the SDK.
{% endhint %}

***

### Next step: implementation in the channel

Once the integration is published, your technical team can begin the SDK implementation using the **Integration ID** obtained.

* If you are going to integrate into a **web application**, see [SDK Web (Loader)](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/solucion-web/sdk-loader-idv.md).
* If you are going to integrate into a **mobile application**, see [SDK Mobile](/docs.facephi-en/products/idv-suite/flujos-and-integraciones/configuracion-tecnica-del-cliente/sdk-mobile.md).

***

### Summary

With a Low-Code integration, you connect your application to a verification flow managed from IDV Suite:

1. **Create** the integration by selecting Low-Code type and the published flow.
2. **Customize** — adjust primary, status, and text colors.
3. **Connect** — configure the webhook if you need real-time notifications.
4. **Configure** — define language, platform, and Bundle ID, and finish the integration.
5. **Implement** the SDK in your channel using the Integration ID and the license (api-key) that the support team will provide you.
6. **Monitor** operations from the Operations module.