Propriedade accent-color CSS

Definição e uso

accent-color A propriedade é usada para especificar a cor de destaque do controle da interface do usuário, por exemplo:

<input type="checkbox">
<input type="radio">
<input type="range">
<progress>

Exemplo

Definir cores de destaque para diferentes controles da interface do usuário:

input[type=checkbox] {
  accent-color: vermelho;
}
input[type=radio] {
  accent-color: verde;
}
input[type=range] {
  accent-color: rgb(0, 0, 255);
}
progress {
  accent-color: hsl(39, 100%, 50%);
}

Experimente você mesmo

Sintaxe CSS

accent-color: auto|color|initial|inherit;

Valor da propriedade

Valor Descrição
auto Valor padrão. O navegador escolhe a cor de destaque.
color

Especificar a cor usada como cor de destaque.

Você pode usar todos os valores de cores válidos (rgb, hexadecimal, cores nomeadas, etc.).

Para mais informações sobre valores válidos, consulte nossa lição de cores CSS.
initial Defina essa propriedade para seu valor padrão. Veja initial.
inherit Herda essa propriedade do elemento pai. Veja inherit.

Detalhes técnicos

Valor padrão: auto
Herança: Sim
Produção de animação: Suporte. Veja:Propriedades relacionadas a animação.
Versão: CSS4
Sintaxe do JavaScript: object.style.accentColor="red"

Suporte do navegador

Os números na tabela indicam a versão do navegador que suporta completamente essa propriedade.

Chrome Edge Firefox Safari Opera
93.0 93.0 92.0 15.4 79.0