> 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/android-sdk/personalizacion.md).

# Customization

## Colors and logo

To change the main colors and the SDK logo:

1. Create a file `sdk_styles.xml` in the client application.
2. Add or modify the value *hex* (RGB) color and logo:

```xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- SdkTheme -->
    <color name="sdkPrimaryColor">#7636FC</color>
    <color name="sdkSecondaryColor">#03DAC5</color>
    <color name="sdkBackgroundColor">#FFFFFF</color>
    <color name="sdkErrorColor">#DD3631</color>
    <!-- SdkColorsPalette -->
    <color name="sdkTitleTextColor">#1D2C4D</color>
    <color name="sdkBodyTextColor">#526080</color>
    <color name="sdkSuccessColor">#07A13A</color>
    <color name="sdkNeutralColor">#202C4B</color>
    <color name="sdkAccentColor">#EA7547</color>
    <color name="sdkTopIconsColor">#243760</color>
    <color name="sdkButtonTextColor">#FFFFFF</color>
    <!-- SDK BUTTONS -->
    <dimen name="sdk_buttons_corner_dimen">32dp</dimen>
    <!-- SDK LOGO -->
    <drawable name="sdk_logo">@drawable/ic_demo_logo</drawable>

  <!-- ..Add particulars of each component... -->

</resources>
```

* The **main colors** that also affect animations are:\
  `sdkPrimaryColor`, `sdkErrorColor`, `sdkSuccessColor`, `sdkNeutralColor`, `sdkAccentColor`.
* To include the **logo** you must add the following line to the file, with the configured name.

```xml
<!-- SDK LOGO -->
<drawable name="sdk_logo">@drawable/logo_name</drawable>
```

Vector format **(.xml).**

{% hint style="info" %}
The Selphi and SelphID components include their associated resource zip, which remains separate from this SDK feature.
{% endhint %}

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

The Lottie files can be overwritten by placing the new files in `res/raw/` with the same names:

```
anim_cancelled.json
anim_success.json
```

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

Create an XML file with the strings to overwrite:

```xml
    <!-- Exit Alert -->
    <string name="fphi_exit_alert_title">Finish the process</string>
    <string name="fphi_exit_alert_question">Do you want to finish the process?</string>
    <string name="fphi_exit_alert_finish">Finish</string>
    <string name="fphi_exit_alert_cancel">Cancel</string>
    <!-- Permissions -->
    <string name="fphi_permissions_camera">In order to continue, &lt;b&gt;you need to allow access to the camera&lt;/b&gt;.</string>
    <string name="fphi_permissions_camera_alt">In order to continue, you need to allow access to the camera.</string>
    <string name="fphi_permissions_title">Permission denied</string>
    <string name="fphi_permissions_general">In order to continue, &lt;b&gt;you need to allow access to the permission needed.&lt;/b&gt;</string>
    <string name="fphi_permissions_general_alt">In order to continue, you need to allow access to the permission needed.</string>
    <string name="fphi_permissions_microphone">In order to continue, &lt;b&gt;allow access to the microphone.&lt;/b&gt;</string>
    <string name="fphi_permissions_microphone_alt">In order to continue, allow access to the microphone.</string>
    <string name="fphi_permissions_confirm">Retry</string>
    <string name="fphi_permissions_confirm_settings">Go to settings</string>
    <!-- Messages -->
    <string name="fphi_close">Close process</string>
    <string name="fphi_info">Show tutorial</string>
    <string name="fphi_finish">Finish</string>
    <string name="fphi_retry">Retry</string>
    <!-- Tutorial -->
    <string name="fphi_tutorial_skip">SKIP</string>
    <string name="fphi_tutorial_skip_alt">Skip advices</string>
    <string name="fphi_tutorial_next">NEXT</string>
    <string name="fphi_tutorial_next_alt">Next advice</string>
    <string name="fphi_tutorial_previous">PREVIOUS</string>
    <string name="fphi_tutorial_previous_alt">Previous advice</string>
    <string name="fphi_tutorial_finish">FINISH</string>
    <string name="fphi_tutorial_finish_alt">Finish advices</string>
    <!-- Check Network -->
    <string name="fphi_network_connection_error_title">Check your internet connection</string>
    <string name="fphi_network_connection_error_desc">Check that your connection is stable and try again.</string>
    <!-- Diagnostic -->
    <string name="fphi_timeout_error_title">Time exceeded</string>
    <string name="fphi_timeout_error_desc">We apologize. The capture could not be made</string>
    <string name="fphi_internal_error_title">There was a technical problem</string>
    <string name="fphi_internal_error_desc">We apologize. The capture could not be made</string>

```

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

* Add the files `.ttf` in the folder `res/font/`.
* 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>

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

To customize the top bar icons, create the resources in `res/drawable/` with the following names:

```
ic_fphi_close_arrow
ic_fphi_close
ic_fphi_info
```

## Images for the permission request and diagnostics screens <a href="#id-6-iconos-de-la-barra-superior" id="id-6-iconos-de-la-barra-superior"></a>

To customize the images that appear on the permission request and diagnostics screens, create the resources in `res/drawable/` with the following names:

```
ic_fphi_camera_permission
ic_fphi_connection_error
ic_fphi_mic_permission
ic_fphi_timeout_error
ic_fphi_error
ic_fphi_support
```

<br>