> For the complete documentation index, see [llms.txt](https://devcenter.unico.io/unico-idpay/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://devcenter.unico.io/unico-idpay/en/integration/customizations.md).

# Customizations

## Logo Customization

It is possible to customize the logo displayed to the end user, as shown in the image below:

<figure><img src="/files/ycXSGYIUZu2skPYEplZa" alt="" width="372"><figcaption></figcaption></figure>

To request the inclusion of this logo, you need to send the Unico team an image in .PNG format, with a size of 56x56px.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXfsnk43Lhhy0I4b__99LSsVEtnZJ8EiIurmbnoMFyv3JACtMVmRpVpvJYWA7LaZtvDIzt6-JYcTrzrcU_1y2RHHzbczLXvebdr5-CnFHa2pmebb4GIYYE5ZIUAt8IVgLWxLlSkj?key=-l_efWrEXCPZq2sSmYhbxJ7g" alt=""><figcaption></figcaption></figure>

## Unaccepted logo formats

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXf24dmRYnjpvk6GymySG0hJGgu47d5tYG4UEYnH-vOBZXfAfNtsn7Vnu-aS2VSyXmmuaL5h3VVd7jruPYt6Y39ZxX8pbNlz0ROx3iWNfNsHPqFV1uyDkvltHQvgKhQmZrd5TduI7w?key=-l_efWrEXCPZq2sSmYhbxJ7g" alt=""><figcaption><p>Unaccepted logo formats</p></figcaption></figure>

{% hint style="warning" %}
Rules:

* Prioritize the application of the logo on backgrounds that guarantee legibility.
* Do not use logos that do not respect the square grid.
* Avoid using low-resolution logos.
* Do not apply the logo on transparent backgrounds.
  {% endhint %}

{% hint style="success" %}
**Recommendations:**

* Prioritize colors with a readable contrast of at least `4.5:1`, following [<mark style="color:blue;">WCAG</mark>](https://accessibleweb.com/color-contrast-checker/) accessibility parameters.
  * Use the hexadecimal of the colors to check the contrast scale. Example: *Foreground ColorPicker:* `#000000`, *Background Color:* `#FFFFFF`, *Contrast Ratio:* `21.00:1.`
    {% endhint %}

## Customizing the color and shape of buttons

Throughout the implementation process, it is possible to request the configuration of the color and shape of the buttons in the IDPay interface, according to the company’s visual identity, as shown in the images below:

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXeKZihBl1Qv79T01gmIpfkTnuIVc4qiwjUOVom_FrmpYCxdr-pKHeK4b9RcPX_fI00G7IKbvgsboN2NdGDP180oPZTx3dSosDQCaZqKWv9giK5n1FF-lVyT0rorNod6DWgPBKTl?key=-l_efWrEXCPZq2sSmYhbxJ7g" alt=""><figcaption><p>Button customization</p></figcaption></figure>

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXeDW-_2Fk0VKmXWlQy-Bntw_3m2GqmrPTJyePI7J9cggl2-oLteDCUTl8P9Bos33_tm95eFomzqTNbayzhIH3UtFDaI65MvLt0wbl2DlQcJ4Tl6WcpcqWvpasE_uPF_YqIfbdf4qg?key=-l_efWrEXCPZq2sSmYhbxJ7g" alt=""><figcaption><p>Contrast examples</p></figcaption></figure>

{% hint style="success" %}
**Recommendations:**

* **Choose accessible colors:** When customizing button colors in By Unico, opt for an accessible color scheme that ensures visibility for all users, including those with visual impairments.
* **Contrast ratios:** Aim for a contrast ratio higher than `4.51:1` for the best results.

Accessible colors improve navigation for everyone, especially for people with low vision. Use hexadecimal color codes to check contrast and follow [<mark style="color:blue;">WCAG</mark>](https://accessibleweb.com/color-contrast-checker/) guidelines.

* **Example:** `#FFFFFF` (text) on `#000000` (background) results in a contrast ratio of `21.00:1`.
  {% endhint %}

### Rounding the button corners

In addition to text and background colors, you can also define the button's corner rounding (border-radius) in pixels, according to the scale below:

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXc6aEahcSWb3yrcNSZCQwUSPuQLjluympWJJQmExfbrf5w-m3pwE1XmVR3sOjqfSylosc02m6FKe55XQ6vq0_HPVnYTHQUV4jyGA02_BIMH_iFtkHlaHrbg6SsiwQ9KuPIDdOo24Q?key=-l_efWrEXCPZq2sSmYhbxJ7g" alt=""><figcaption><p>Rounding the button corners</p></figcaption></figure>

### Customization settings

To configure the visual identity of the client or partner for the button, share the following information with Unico's implementation team:

* Hexadecimal color code for the button's background.
  * Example: `#000000.`
* Hexadecimal color code for the button’s text.
  * Example: `#ffffff.`
* Button corner rounding in pixels.
  * Example: `10px.`


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://devcenter.unico.io/unico-idpay/en/integration/customizations.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.