# Topo do tema

<figure><img src="https://2884932333-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FXcvR20Plhqns8crni1qC%2Fuploads%2FaYrMTBub0do18sO5qehK%2Ftopo-do-tema.png?alt=media&#x26;token=25511410-76ed-4061-bfb6-d8b24c3ee727" alt=""><figcaption></figcaption></figure>

**Cor de fundo**: Cor de fundo do topo do tema, ou seja, o cabeçalho.

**Cor dos ícones**: Cor dos ícones exibidos no topo do tema, incluindo ícone de carrinho, conta e pesquisa.

**Cor dos textos**: Cor dos textos exibidos no topo, basicamente as informações da conta.

**Cor dos links ao passar o mouse**: Cor do texto ao passar o mouse sobre os links de ajuda, minha conta e carrinho.

**Cor do fundo quantidade no carrinho**: Cor de fundo onde é exibido a quantidade de produto no carrinho.

**Cor do número quantidade no carrinho**: Cor do texto para a quantidade de produtos no carrinho.

**Cor de fundo do menu de navegação**: Cor utilizada no fundo do menu principal da loja, o que aparece logo abaixo do logo e do campo de pesquisa.

**Cor do texto do primeiro nível do menu de navegação**: Cor utilizada nos textos do primeiro nível do menu, o que aparece logo abaixo do logo e do campo de pesquisa.

**Cor da borda inferior do item do menu ao passar o mouse sobre**: Cor utilizada nos itens do primeiro nível do menu. Ao passar o mouse sobre um dos itens, uma barra verde aparecerá logo abaixo.

**Cor de fundo dos submenus de navegação**: Cor utilizada no fundo dos submenus, ou seja, segundo nível do menu. Caso o primeiro nível tenha subcategorias, um box será exibido com essa cor aplicada ao fundo.

**Cor do texto dos demais níveis do menu de navegação**: Cor utilizada em todos os itens do submenu de navegação, ou seja, segundo e terceiro níveis. Recomendamos uma cor que contraste com a cor escolhida anteriormente.

**Cor do texto dos demais níveis do menu de navegação ao passar o mouse**: Cor utilizada quando passar o mouse sobre um item do submenu de navegação, ou seja, segundo e terceiro níveis.

**Cor do texto do item principal dos demais níveis do menu de navegação**: Cor utilizada no título da subcategoria quando o menu tiver um terceiro nível. Repare que as cores serão invertidas nesse caso, no qual ao passar o mouse a cor será a mais escura. A imagem abaixo ilustra melhor esse comportamento.