O Chrome introduziu o conceito de uma cor de tema para seu site em 2014. A cor do tema é uma dica da sua página da Web que informa ao navegador qual cor usar para os elementos da interface, como a barra de endereço.
Por exemplo, abaixo está este site com e sem a cor do tema aplicada.
O problema é que você precisa definir a cor do tema em cada página. Se você tiver um site grande ou legado, não é sempre viável fazer muitas alterações em todo o site.
A partir do Chrome 46 (Beta de setembro de 2015), a adição de um atributo theme_color
ao manifesto vai ter o efeito de aplicar a cor automaticamente
a todas as páginas que o usuário visitar no seu domínio quando o site for iniciado na tela inicial.
Se a página já tiver uma metatag de cor do tema, por exemplo, <meta name="theme-color" content="#2196F3">
,
a configuração no nível da página será usada em vez do valor no manifesto.
Basta adicionar o atributo theme_color
ao manifesto e especificar uma cor HTML.
"theme_color": "#2196F3"
Para conferir isso em ação, acesse Airhorner, o melhor apito do mundo e adicione à tela inicial. Ou confira o manifesto do site.
Perguntas frequentes
- Isso se aplica se meu site não for iniciado na tela inicial?
Sim. - Isso vai se aplicar a todo o meu site, por exemplo, quando o usuário estiver apenas navegando?
No momento, isso é improvável, porque o navegador precisaria fazer o download do manifesto com muito mais frequência, e atualmente ele é um recurso de baixa prioridade. O objetivo é analisar quando o usuário adiciona o site à tela inicial.