> ## 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 como personalizar o Editor de Projetos com temas personalizados, esquemas de cores e realce de sintaxe. Os temas no Replit permitem personalizar a aparência do Editor de Projetos, desde cores de fundo e elementos de interface até o realce de sintaxe do seu código. Personalize seu ambiente de desenvolvimento para melhor legibilidade, menos cansaço visual e uma experiência de programação mais agradável. Captura de tela do editor de temas do Replit exibindo opções de personalização de cores ## Criando um tema personalizado Siga estas etapas 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 **Temas**) 2. Selecione **Criar novo tema** 3. Insira 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 do tema controlam a aparência geral da interface: * **Fundo**: Define a cor base para a maioria das superfícies da interface * **Contorno**: Controla a cor das bordas e divisórias * **Primeiro plano**: Determina as cores de texto e ícones * **Primário**: Define a cor de botões e elementos interativos * **Positivo**: Aplicado a indicadores de sucesso, como o botão **Executar** * **Negativo**: 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 como diferentes elementos de código são exibidos 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 forneçam contraste suficiente em relação ao fundo. | Elemento | Descrição | | ------------------------------ | ----------------------------------------------------------------------------------- | | **Nomes de Variáveis** | Aplicado a variáveis quando nenhuma palavra-chave de declaração é usada | | **Definições de Variáveis** | Colore nomes de variáveis quando definidas com palavras-chave como `const` ou `var` | | **Referências a Funções** | Aplicado ao chamar funções | | **Definições de Funções** | Colore nomes de funções durante a declaração | | **Palavras-chave** | Realça palavras-chave da linguagem como `import`, `function` e `return` | | **Nomes de Propriedades** | Colore o acesso a propriedades de variáveis | | **Definições de Propriedades** | Usado ao definir propriedades de objetos | | **Propriedades de Funções** | Aplicado ao chamar métodos em objetos | | **Nomes de Tags** | Usado para tags HTML e JSX | | **Nomes de Tipos** | Colore anotações de tipo em linguagens tipadas | | **Nomes de Classes** | Aplicado a declarações e referências de classes | | **Nomes de Atributos** | Realça atributos HTML e JSX | | **Comentários** | Aplicado a todos os comentários de código | | **Strings** | Colore literais de string | | **Números** | Realça valores numéricos | | **Booleanos** | Formata valores booleanos (`true`/`false`) | | **Expressões Regulares** | Colore padrões de regex | | **Operadores** | Realça operadores como `+`, `-`, `*` e `/` | | **Colchetes** | Colore colchetes quadrados e angulares 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 diferença suficiente entre elementos de fundo e de primeiro plano * **Crie paletas coesas**: Escolha cores que se complementem em vez de conflitar * **Mantenha brilho consistente**: Preserve um nível de brilho similar entre os elementos de sintaxe * **Design 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 em [Configurações](https://replit.com/settings) em **Usuário** → **Personalização** (ou a seção **Temas**). ### Alternando 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 temas personalizados que você criou podem ser editados ou excluídos. Temas padrão e 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 combinar com suas preferências Pré-visualize qualquer tema antes de instalá-lo para ver como ele ficará no Editor de Projetos. ## Portando do VS Code Importe seus temas favoritos do VS Code para o Replit mapeando as cores equivalentes durante o processo de criação do tema.