---
sourceDocument: Yokohama Mobile Configuração e navegação
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/yokohama/mobile

 Release :

    - yokohama

ft:locale :

    - pt-BR

ft:publication_title :

    - Yokohama Mobile Configuração e navegação

ft:clusterId :

    - mobile

bundleId :

    - mobile

workflow :

    - Platform


---

# Configure um ícone de fonte para usar uma variável de tema para definir sua cor

# Configure um ícone de fonte para usar uma variável de tema para definir sua cor {#ariaid-title1}

* Versão de lançamento: Yokohama
* 
* Atualizado 30 de jan. de 2025
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 2 min. de leitura

Especifique a propriedade personalizada CSS de um registro sys_ux_theme para definir a cor de um ícone de fonte.

## Antes de Iniciar

Você deve saber o registro sys_ux_theme da variável de tema que você deseja usar para definir a cor do ícone da fonte. O valor de que você precisa para a variável de tema é a propriedade personalizada CSS na tabela de propriedades sys_ux_theme.

Função necessária: administrador

## Por Que e Quando Desempenhar Esta Tarefa

As variáveis de tema só podem ser aplicadas a ícones de fonte.

Você pode configurar um ícone no fluxo de trabalho de configuração de uma tela ou pode configurar um ícone selecionando Cartões e ícones categoria do Construtor de apps para celularmenu. Este procedimento usa o. Cartões e ícones categoria.

## Procedimento

1. Navegar até TudoSistema MóvelConstrutor de apps para celular.  
   . Construtor de apps para celularabre em uma nova guia do navegador e exibe a tela de seleção do escopo da aplicação.
2. PESQUISE o escopo da aplicação em que você está trabalhando e selecione o nome do escopo da aplicação.  
   . Construtor de apps para celulara tela inicial de categorias é exibida.
3. Selecione Cartões e ícones e selecione Novo .
4. Na caixa de diálogo Criar um cartão ou ícone, selecione Ícone e, em seguida, selecione Continuar .
5. No formulário de ícone, insira um Nome para o ícone.  
   Certifique-se de escolher um nome que facilite a identificação do ícone.
6. Na lista suspensa Tipo, selecione Fonte .
7. Na seção Definir aparência, insira as seguintes informações em Estilo e. Valor campos para configurar o ícone de fonte que usa uma variável de tema para definir sua cor.  
   Selecione o ícone de mais para adicionar uma linha.
   {#config-font-icon-to-use-color-theme-var__table_mzt_jgj_vwb__entry__2}

   | Estilo | Valor |
   |-|-|
   | Insira <kbd class="ph userinput">Nome da fonte </kbd> | Insira uma das seguintes famílias de fontes: * <kbd class="ph userinput">now-mobile-icons</kbd> Esses ícones foram projetados para serem usados em telas. Use-os para listas e destinos de seção que vão para telas de lista e telas do navegador. Use estes ícones para representar um fluxo de trabalho ou uma tela para a qual você deseja que os usuários naveguem. * <kbd class="ph userinput">now-mobile-icons-cards</kbd> Use estes ícones no corpo dos cartões. * <kbd class="ph userinput">now-mobile-icons-buttons</kbd> Esses ícones foram projetados para serem usados em funções. Eles podem ser usados em botões localizados em cartões ou para ações rápidas. * <kbd class="ph userinput">Now-mobile-icons-ALPnavbar</kbd> Esses ícones aparecem no canto superior direito da tela do celular e são usados como navegação para outra tela. {#config-font-icon-to-use-color-theme-var__ul_vbq_mgj_vwb} |
   | Insira <kbd class="ph userinput">Valor </kbd> | Insira o código que identifica o ícone na família de fontes que você deseja usar. Por exemplo, <kbd class="ph userinput">e903 </kbd>é o código do ícone do carrinho sólido no now-mobile-icons-buttonsfamília de fontes. Para listas de códigos de ícone de família de fontes, consulte \[adicionar link aos tópicos de referência\]. |
   | Insira <kbd class="ph userinput">Fonte ColorVariable </kbd>para especificar uma variável de tema para a cor do seu ícone. Esta configuração é opcional. Se você não especificar uma cor, a cor do ícone padrão será preta. Se você quiser usar um código de cor hexadecimal, consulte \[link para "Configurar ícones de tipo de fonte"\], que contém informações sobre como configurar a cor do ícone usando códigos de cores hexadecimais. | Insira a variável de tema da cor que você deseja usar. Por exemplo, a seguinte propriedade personalizada CSS: <kbd class="ph userinput">--now-acordeon-color</kbd> |
   | Insira <kbd class="ph userinput">Nome </kbd> | Insira o nome listado para o ícone na família de fontes. Por exemplo, se você quiser usar o ícone do carrinho de compras no now-mobile-iconsfamília, você inseriria <kbd class="ph userinput">Carrinho </kbd>. Para listas de nomes de ícones de família de fontes, consulte [Referência do ícone para celular](https://servicenow-prod.fluidtopics.net/SolbTaddCyD2OhV5bKaNhA "Uso Construtor de apps para celularpara inserir esses ícones em seus aplicativos para celular."). |
   [ ]

   {#config-font-icon-to-use-color-theme-var__table_mzt_jgj_vwb}
8. Selecione Salvar.