Personalizar o tema do app

Este tutorial mostra como alterar as cores do aplicativo por área (Home, Faturas, Login etc.), conferir na prévia e publicar. Também mostra como gerar um tema com IA.

Iniciante

3 min de leitura

Nesta página

Este tutorial mostra como alterar as cores do aplicativo por área (Home, Faturas, Login etc.), conferir na prévia e publicar. Também mostra como gerar um tema com IA.


1. Abra a tela de Tema

No menu lateral, em Configurações, clique em Personalização. A aba Tema abre selecionada.

Na primeira vez, aparece a janela Conheça o Tema V2:

Conheça o Tema V2
Conheça o Tema V2

Clique em Entendi (ou Ver depois) para fechar a janela e seguir para o editor.

Para ver a janela de novo, clique em Conhecer v2 no topo da tela.

Se o tema v2 ainda não estiver ativo, a janela mostra o botão Ativar v2. Ativar só prepara a edição nesta tela. Para publicar no aplicativo, ainda é preciso clicar em Salvar. Aparece "Tema v2 ativado. Salve para publicar no aplicativo."

2. Edite as cores

Editor de tema
Editor de tema
  1. Onde essa cor aparece no app?: digite um texto que aparece no celular (ex.: Pagar agora, Trocar contrato, Meu Móvel). A tela leva você direto à área e ao campo certos.
  2. Áreas do app (coluna da esquerda): clique na área que quer editar, como Marca e topos, Login, Concluir cadastro, Início, Descubra mais, Faturas, Meu Móvel, Novidades, Você, Gerenciar redes, Itens compartilhados ou Base.
  3. Na coluna do meio, os campos ficam agrupados em blocos (ex.: Cor principal, Gradientes dos topos). Para cada cor:
    1. digite o código no campo (ex.: #00AE8B);
    2. ou clique no quadrado colorido para escolher a cor;
    3. o ícone ⓘ explica onde a cor é usada;
    4. Detalhes avançados mostra o nome técnico do campo.
  4. Prévia (coluna da direita): mostra a área escolhida com as cores atuais. Os números na prévia são os mesmos dos campos de cor, para você saber qual campo muda cada parte.
  5. Clique em Salvar no topo. Aparece "Tema atualizado com sucesso." e as cores passam a valer no aplicativo.

Enquanto você não salvar, as mudanças ficam só na prévia.

3. Gere um tema com IA (opcional)

Clique em Gerar tema com IA no topo. Abre a janela Como você quer o tema?:

Gerar tema com IA
Gerar tema com IA
  1. Área que deseja alterar: escolha Tema completo ou só uma área (ex.: Faturas). Escolher uma área altera apenas as cores dela.
  2. Descrição do tema: descreva o estilo desejado, as cores e se prefere tema claro ou escuro (até 6.000 caracteres). Ex.: "Quero um tema escuro, sofisticado e minimalista, usando azul-marinho nas ações principais e tons neutros nas superfícies."
  3. Clique em Gerar tema. Em Resposta da IA aparecem a análise, as alterações propostas e os avisos.
  4. Se a IA pedir confirmação, clique em Aplicar à prévia.
  5. Para tentar outra proposta, ajuste a descrição e clique em Gerar novamente.
  6. Clique em Fechar e confira o resultado na prévia do editor.
  7. Se estiver tudo certo, clique em Salvar.

Cancelar fecha a janela sem alterar nada. A proposta da IA nunca é publicada sozinha: ela só vai para a prévia e você revisa antes de salvar.

Compartilhe este tutorial

Continue lendo

Selecionados a partir dos assuntos deste tutorial.

Todos os tutoriais