HomepageAutenticaçãoAPI Reference

Personalizações

Nesta seção, você encontrará todas as personalizações disponíveis no produto Unico IDPay

Personalização da logotipo

É possível personalizar a logo que é apresentada para o usuário final, conforma imagem abaixo:

Para solicitar a inclusão desta logo, é necessário enviar ao time Unico uma imagem no formato .PNG no tamanho de 56x56px.

Grids de logotipo aceitos

Formatos de logotipo não aceitos

Formato de logotipo não aceitos

Regras:

  • Priorize a aplicação do logotipo em planos de fundo que garantam a legibilidade.

  • Não utilize logotipos que não respeitem o grid quadrado.

  • Evite o uso de logotipos em baixa resolução.

  • Não aplique o logotipo em fundos transparentes.

Recomendações:

  • Priorize cores com contraste legível de no mínimo 4.5:1, seguindo os parâmetros de acessibilidade da WCAG.

    • Utilize o hexadecimal das cores para verificar a escala de contraste. Exemplo: Foreground ColorPicker: #000000, Background Color: #FFFFFF, Contrast Ratio: 21.00:1.

Personalização da cor e formato dos botões

Ao longo do processo de implantação, é possível solicitar a configuração da cor e formato dos botões na interface no IDPay, de acordo com a identidade visual da empresa, conforme imagens abaixo:

Personalização do botão
Exemplos de contraste

Recomendações:

  • Escolha cores acessíveis: Ao personalizar as cores dos botões no by Unico, opte por um esquema de cores acessível, que garanta a visualização para todos os usuários, incluindo aqueles com deficiência visual.

  • Taxas de contraste: Busque uma taxa de contraste superior a 4.51:1 para obter os melhores resultados.

Cores acessíveis facilitam a navegação para todos, especialmente para pessoas com baixa visão. Utilize o hexadecimal das cores para verificar o contraste e siga as recomendações da WCAG.

  • Exemplo: #FFFFFF (texto) em #000000 (fundo) resulta em uma taxa de contraste de 21.00:1.

Arredondamento dos cantos no botão

Além das cores do texto e de fundo, você também pode definir o arredondamento dos cantos (border radius) em pixels, conforme a escala abaixo:

Configurações de personalização

Para realizar essa configuração, é só enviar as seguintes informações ao time Unico:

  • Código hexadecimal da cor de background no botão.

    • Ex: #000000.

  • Código hexadecimal da cor de texto no botão.

    • Ex: #ffffff.

  • Arredondamento dos cantos no botão em pixels.

    • Ex: 10px.

PreviousSDKNextBoas práticas de comunicação

Last updated

Was this helpful?