> For the complete documentation index, see [llms.txt](https://docs.elkyc.com/home/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.elkyc.com/home/build-verification-flows/ui-customization.md).

# 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="/files/FdIgGwlJB473ROjqfhA4" 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="/files/nlr7sqFnyuvzvIdmHbG3" alt=""><figcaption></figcaption></figure>

* By default, the verification flow uses the **Light theme**. To switch to a dark appearance:

  1. Click the **Mode** dropdown.
     1. Select **Dark theme** from the available options.
     2. The preview panel will automatically update to display the verification flow using the dark color scheme.

  The selected theme is applied across all steps of the verification flow, ensuring a consistent user experience throughout the process.

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

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

<figure><img src="/files/QKtRaOqlfT3KaeuW5fyn" 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="/files/51eduU1IXVvSWYe37vPg" 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="/files/XvDu7H1tlbqLTm3LCRep" 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="/files/lUSImnHQFAyqNspGqdiq" 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="/files/JI7ruk3BAeWDK1yjyPVK" alt=""><figcaption></figcaption></figure>
