---
title: "Como mudar a cor do resultado de busca destacada em artigos"
slug: "how-to-change-the-highlighted-search-result-color-in-articles"
description: "When you have enabled the highlight matching search keyword in the articles option, the search keywords present in the article will be highlighted."
tags: ["Customization"]
updated: 2026-06-22T08:58:57Z
published: 2026-06-22T08:58:57Z
canonical: "docs.document360.com/how-to-change-the-highlighted-search-result-color-in-articles"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.document360.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Como mudar a cor do resultado de busca destacada em artigos

Quando a configuração **Destacar Palavras-chave de Busca Correspondentes em Artigos** está ativada, o Document360 destaca automaticamente o termo de busca onde quer que ele apareça em um artigo. A cor padrão de destaque é amarelo. Você pode substituir isso com uma cor personalizada, por exemplo, para combinar com a paleta da sua marca ou melhorar o contraste, tanto para os modos Claro quanto para o Escuro.

---

## Quando usar isso

Use essa personalização quando quiser:

- Substitua o destaque amarelo padrão por uma cor que combine com sua marca ou tema do site.
- Aumente a visibilidade dos destaques dos termos de busca em relação à cor do fundo da sua base de conhecimento.
- Aplique um estilo consistente de luzes tanto nos modos Claro quanto Escuro.

---

## Antes de começar

- A configuração **Destaques para Palavras-chave de Busca em Artigos** deve estar ativada para que os destaques da busca apareçam. Ative em **Configurações** (

) > **site da base de conhecimento** > **personalização do site** antes de aplicar este CSS.
- Você precisa de acesso às **Configurações** (

) > **Site da base de conhecimento** > **Personalização do site** > **CSS & JavaScript personalizados** no portal da base de conhecimento.

---

## Como mudar a cor de destaque da palavra-chave de busca

1. Navegar até **Configurações** (

) > **Site da base de conhecimento** > **Personalização do site** > **CSS & JavaScript personalizados** no portal da base de conhecimento.

![Custom CSS and JavaScript settings panel in the Document360 Knowledge base portal](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Custom%20css%20&%20js.png)
2. No painel de navegação à esquerda, selecione a aba **CSS** e cole o seguinte trecho:

```
.fp-search-content em, .search-content em {
    background-color: #4E1E66;
    color: white;
}
```

> Nos trechos de exemplo acima, verde e roxo são usados como cores de destaque com texto branco. Substitua esses valores pelos valores de cor desejados.

1. Atualize os `background-color` valores e `color` para as cores desejadas.
2. Clique **em Salvar**.

![CSS tab showing the search highlight color snippet saved in the Custom CSS and JavaScript panel](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Change%20highlighted%20search%20result%20color.png)

---

## Desfecho

**Antes**

As palavras-chave de busca são destacadas com a cor amarela padrão fornecida pelo Document360.

![Search results showing the default yellow highlight color before applying the CSS](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Highlighted%20search%20result%20-%20Before.png)

**Depois**

As palavras-chave de busca são destacadas com a cor `#4E1E66` de fundo personalizada e o texto branco após aplicar o CSS.

![Search results showing the custom purple highlight color after applying the CSS](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Highlighted%20search%20result%20-%20After.png)

---

## Melhores práticas

- **Escolha uma cor de destaque que contraste tanto com o fundo da página quanto com o texto.** Uma cor de destaque que se mistura ao fundo é invisível; um que conflita com a cor do texto reduz a legibilidade. Teste a combinação escolhida tanto nos modos Luz quanto nas Trevas.
- **Mantenha a cor do texto (`color`) sincronizada com o fundo das luzes.** O trecho define tanto o fundo de destaque (`background-color`) quanto a cor do texto (`color`) dentro do destaque. Se você mudar o fundo para uma cor escura, use `white` para o texto. Se você usar um fundo claro, use uma cor de texto escura.
- **Use valores HEX ou RGB em vez de nomes de cores.** Nomes de cores CSS como `green` são imprecisos. Substitua-os pelo seu código HEX específico para resultados precisos e consistentes com a marca.
- **Verifique se a configuração Destaque de Palavras-chave de Busca está ativada.** Se os destaques não aparecerem após aplicar o CSS, verifique se o recurso está ativado. A mudança de CSS afeta apenas a cor — ela não pode ativar o recurso em si.