> ## Documentation Index > Fetch the complete documentation index at: https://docs.replit.com/llms.txt > Use this file to discover all available pages before exploring further. # Temas do Replit > Aprenda a personalizar o Editor de Projeto com temas personalizados, esquemas de cores e realce de sintaxe. Os temas no Replit permitem personalizar a aparência do Editor de Projeto, desde as cores de fundo e os elementos de interface até o realce de sintaxe do seu código. Personalize seu ambiente de desenvolvimento para melhor legibilidade, menor cansaço visual e uma experiência de programação mais agradável. Captura de tela do editor de temas do Replit mostrando opções de personalização de cores ## Criando um tema personalizado Siga estes passos para criar e personalizar seu próprio tema: 1. Abra as [Configurações](https://replit.com/settings) e vá para **Usuário** → **Personalização** (ou a seção **Themes**) 2. Selecione **Criar novo tema** 3. Digite um título, selecione um esquema de cores (claro ou escuro) e adicione uma descrição opcional 4. Selecione **Criar Tema** para abrir o Editor de Temas As configurações globais de tema controlam a aparência geral da interface: * **Background**: Define a cor base da maioria das superfícies da interface * **Outline**: Controla a cor das bordas e divisores * **Foreground**: Determina as cores do texto e dos ícones * **Primary**: Define a cor dos botões e elementos interativos * **Positive**: Aplica-se a indicadores de sucesso, como o botão **Run** * **Negative**: Exibido para erros e avisos de ações destrutivas Selecione **Aplicar Tema** para começar a usar seu tema personalizado imediatamente. ## Realce de sintaxe Personalize a aparência de diferentes elementos de código para melhorar a legibilidade e a compreensão. Um realce de sintaxe adequado torna o código mais fácil de escanear e entender rapidamente. Escolha cores que funcionem bem juntas e ofereçam contraste suficiente com o fundo. | Elemento | Descrição | | ------------------------ | ----------------------------------------------------------------------------------- | | **Variable Names** | Aplica-se a variáveis onde nenhuma palavra-chave de declaração é usada | | **Variable Definitions** | Colore nomes de variáveis quando definidas com palavras-chave como `const` ou `var` | | **Function References** | Aplica-se ao chamar funções | | **Function Definitions** | Colore nomes de funções durante a declaração | | **Keywords** | Destaca palavras-chave da linguagem como `import`, `function` e `return` | | **Property Names** | Colore o acesso a propriedades a partir de variáveis | | **Property Definitions** | Usado ao definir propriedades de objetos | | **Function Properties** | Aplica-se ao chamar métodos em objetos | | **Tag Names** | Usado para tags HTML e JSX | | **Type Names** | Colore anotações de tipo em linguagens tipadas | | **Class Names** | Aplica-se a declarações e referências de classes | | **Attribute Names** | Destaca atributos HTML e JSX | | **Comments** | Aplica-se a todos os comentários de código | | **Strings** | Colore literais de string | | **Numbers** | Destaca valores numéricos | | **Booleans** | Formata valores booleanos (`true`/`false`) | | **Regular Expressions** | Colore padrões de regex | | **Operators** | Destaca operadores como `+`, `-`, `*` e `/` | | **Brackets** | Colore colchetes e chevrons quando apropriado | ## Boas práticas de design de temas Crie temas visualmente atraentes e funcionais seguindo estas diretrizes: ### Cor e contraste * **Equilibre o contraste**: Garanta uma diferença suficiente entre os elementos de fundo e de primeiro plano * **Crie paletas coesas**: Escolha cores que se complementem em vez de conflitar * **Mantenha brilho consistente**: Mantenha um nível de brilho semelhante entre os elementos de sintaxe * **Projete para acessibilidade**: Considere usuários com deficiências visuais evitando combinações de baixo contraste Problemas comuns de design de temas a evitar: * Diferenças excessivas de brilho entre elementos de sintaxe * Cores mal combinadas que criam discordância visual * Contraste insuficiente entre o código e o fundo ## Gerenciando seus temas Acesse e gerencie todos os seus temas instalados nas [Configurações](https://replit.com/settings), em **Usuário** → **Personalização** (ou a seção **Themes**). ### Alternando entre temas Selecione o botão ao lado do título de um tema para ativá-lo como seu tema atual. ### Editando temas Modifique seus temas personalizados selecionando o menu de três pontos e clicando em **Editar**. Apenas os temas personalizados que você criou podem ser editados ou excluídos. Os temas padrão e os temas criados por outras pessoas não podem ser modificados. ### Excluindo temas Remova temas personalizados usando o menu de três pontos e selecionando **Excluir**. ## Explorando temas da comunidade Descubra temas criados pela comunidade do Replit na [página de exploração de temas](https://replit.com/themes). ### Encontrando temas * Pesquise por nome para encontrar temas específicos como "Atom One Dark" * Filtre por autor para explorar temas de criadores específicos * Navegue por esquema de cores para encontrar temas claros ou escuros * Pesquise por cores específicas para corresponder às suas preferências Visualize qualquer tema antes de instalá-lo para ver como ele ficará no Editor de Projeto. ## Portando do VS Code Importe seus temas favoritos do VS Code para o Replit mapeando cores equivalentes durante o processo de criação do tema.