> 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/sdks/sdk-mobile/ios-sdk/personalizacion.md).

# Customization

## Colors and logo

To change the colors and logo of the SDK, the following must be included **Assets** in the folder `Resources` of the client application.

<div align="left"><figure><img src="/files/0b0aa9134ee3af756caedb356b4a491de45489fa" alt="" width="272"><figcaption></figcaption></figure></div>

<div align="left"><figure><img src="/files/54d0acdcf8fb9b23fce2d95b0f9dd5532a888bce" alt="" width="414"><figcaption></figcaption></figure></div>

### General

```
sdkAccentColor
sdkBackgroundPrimaryColor
sdkBackgroundSecondaryColor
sdkBackgroundDisabled
sdkBodyTextColor
sdkDisabledBackgroundColor
sdkButtonTextColor
sdkErrorColor
sdkNeutralColor
sdkPrimaryColor
sdkSecondaryColor
sdkSuccessColor
sdkTitleTextColor
sdkTopIconsColor
```

### Component-specific

* Video calls: `sdkActionsBackgroundColor`, `sdkButtonBackgroundColor`
* Video identification: `sdkTopIconsVideoColor`

**Note:** changing the primary colors (`sdkPrimaryColor`, `sdkErrorColor`, `sdkSuccessColor`, `sdkNeutralColor`, `sdkAccentColor`) will also affect the animations.

{% hint style="info" %}
The components **Selphi** and **SelphID** use their own resource package (`zip`), so **they are not affected** by this customization.
{% endhint %}

## Animations <a href="#id-2-animaciones" id="id-2-animaciones"></a>

If you want to modify the animations (**Lottie**) of the SDK, it is enough to include the new animations with the **same name** in the application.

The exact names of the animations are documented in the customization section of each component.

## Texts <a href="#id-3-textos" id="id-3-textos"></a>

The texts can be customized by overriding the value of the keys in a file `Localizable.strings`.

* The keys with suffix **`_alt`** are the texts used in the labels for **accessibility** required for the functionality of **VoiceOver**.
* Each component includes the list of keys available for modification.

## Fonts <a href="#id-4-fuentes" id="id-4-fuentes"></a>

* Add the files `.ttf` to the application.
* Assign the **exact name** expected by the SDK. If the name does not match, the font will not be applied.

<div align="left"><figure><img src="/files/cdf6fe12703efbd7f1281706097f09ee054a9e45" alt=""><figcaption></figcaption></figure></div>

## Generic icons <a href="#id-6-iconos-de-la-barra-superior" id="id-6-iconos-de-la-barra-superior"></a>

To customize the multiple icons that appear in the SDK, create the resources in the application's ASSETS with the following names:

```
sdk_logo
ic_sdk_close
ic_sdk_close_arrow
ic_sdk_error_connection
ic_sdk_error_timeout
ic_sdk_unknown_error
ic_sdk_permission_camera
ic_sdk_permission_micro
ic_sdk_permission_generic
ic_sdk_info
ic_sdk_pager_back
ic_sdk_pager_forward
```