# UI Customization

It allows you to align the appearance of the verification flows with your branding preferences. Customize colors, fonts, and button styles effortlessly to match your company's look and feel.

* Open your flow and go to `Style` tab:

<figure><img src="https://1111746725-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3YdYFOUPi8bWAiBfJgPb%2Fuploads%2FlpJx9ji2IaElNmtCdFKC%2FScreenshot%202024-05-29%20at%2009.26.56.png?alt=media&#x26;token=a1d3b50f-1627-4dd3-8dcb-d8ca9bab05a3" alt=""><figcaption></figcaption></figure>

* You can choose a color palette that is applied to pictures and color blocks throughout the verification flow:

<figure><img src="https://1111746725-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3YdYFOUPi8bWAiBfJgPb%2Fuploads%2FB4Eg9k6JSMzMZJxEvm4e%2FScreenshot%202024-05-29%20at%2009.28.58.png?alt=media&#x26;token=66fc593a-f2e7-499f-ae12-0850652f4fa4" alt=""><figcaption></figcaption></figure>

* Fonts can be customized using Google Fonts in the following format: fontname @font weight.

<figure><img src="https://1111746725-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3YdYFOUPi8bWAiBfJgPb%2Fuploads%2FL3VHvvXySYaxWc9i91jk%2FScreenshot%202024-05-29%20at%2009.30.51.png?alt=media&#x26;token=f6a4a534-43df-41ce-a023-83902da3408f" alt="" width="317"><figcaption></figcaption></figure>

* Customize the colors of buttons and button borders to match the branding theme. You can select primary button colors, border, text and hover colors.

<figure><img src="https://1111746725-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3YdYFOUPi8bWAiBfJgPb%2Fuploads%2FUFZq69XOSDnDDr7eyYi8%2FScreenshot%202024-05-29%20at%2009.32.46.png?alt=media&#x26;token=47b8876f-4113-44d0-9c6f-9e2e8bfa1c96" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Changes made in the style customization are applied to the entire flow, ensuring a consistent and branded experience for users.
{% endhint %}

* All changes are instantly reflected in a real-time preview:

<figure><img src="https://1111746725-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3YdYFOUPi8bWAiBfJgPb%2Fuploads%2F1FXrxiVHkDcIyHiha2aG%2FScreenshot%202024-05-29%20at%2009.36.06.png?alt=media&#x26;token=ad437049-743c-45c6-92e4-79e66fe46746" alt=""><figcaption></figcaption></figure>

* Click on the icon buttons at the bottom of the screen to navigate between different steps in the verification workflow:

<figure><img src="https://1111746725-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3YdYFOUPi8bWAiBfJgPb%2Fuploads%2F90MBFV8XUFAyn5dBjsq8%2FScreenshot%202024-06-28%20at%2011.35.09.png?alt=media&#x26;token=9eb39a77-129e-4f57-bd1f-e2d3fea3700f" alt=""><figcaption></figcaption></figure>

* The main display area will update to show the selected step, allowing you to preview and edit its content and settings.
* To apply and save changes, you need to click the `Save` button:

<figure><img src="https://1111746725-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3YdYFOUPi8bWAiBfJgPb%2Fuploads%2FK8aQSkVnlldkPXrXflqq%2FScreenshot%202024-05-29%20at%2009.37.37.png?alt=media&#x26;token=84a796a7-36aa-45c3-9132-c8b34fd64ce9" alt=""><figcaption></figcaption></figure>


---

# 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.allpass.ai/build-verification-flows/ui-customization.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.
