O que são temas?

Um tema é um tipo especial de extensão que altera a aparência do navegador. Os temas são empacotados como extensões normais, mas não contêm código JavaScript ou HTML.

Você pode encontrar e testar vários temas na Chrome Web Store.

tema de plantas verdes

tema de fumaça

tema jus d'orange

Manifesto

Confira um exemplo de arquivo manifest.json para um tema:

{
  "manifest_version": 2,
  "version": "2.6",
  "name": "camo theme",
  "theme": {
    "images" : {
      "theme_frame" : "images/theme_frame_camo.png",
      "theme_frame_overlay" : "images/theme_frame_stripe.png",
      "theme_toolbar" : "images/theme_toolbar_camo.png",
      "theme_ntp_background" : "images/theme_ntp_background_norepeat.png",
      "theme_ntp_attribution" : "images/attribution.png"
    },
    "colors" : {
      "frame" : [71, 105, 91],
      "toolbar" : [207, 221, 192],
      "ntp_text" : [20, 40, 0],
      "ntp_link" : [36, 70, 0],
      "ntp_section" : [207, 221, 192],
      "button_background" : [255, 255, 255]
    },
    "tints" : {
      "buttons" : [0.33, 0.5, 0.47]
    },
    "properties" : {
      "ntp_background_alignment" : "bottom"
    }
  }
}

Cores

As cores estão no formato RGB. Para encontrar as strings que podem ser usadas no campo "colors", consulte kOverwritableColorTable.

imagens

Os recursos de imagem usam caminhos relativos à raiz da extensão. É possível substituir qualquer uma das imagens especificadas pelas strings em kPersistingImages. Todas as imagens precisam ser armazenadas no formato PNG. Caso contrário, elas não serão renderizadas corretamente.

properties

Esse campo permite especificar propriedades como alinhamento e repetição do plano de fundo e um logotipo alternativo. Para ver as propriedades e os valores que elas podem ter, consulte kDisplayProperties.

tingimentos

É possível especificar tonalidades para serem aplicadas a partes da interface, como botões, o frame e a guia de segundo plano. O Google Chrome oferece suporte a matizes, não imagens, porque as imagens não funcionam em todas as plataformas e são frágeis quando são adicionados novos botões. Para encontrar as strings que podem ser usadas no campo "tonalidades", consulte kTintTable.

As tonalidades estão no formato Hue-Saturation-Lightness (HSL), usando números de ponto flutuante no intervalo de 0 a 1,0:

  • Hue é um valor absoluto, sendo 0 e 1 vermelho.
  • A saturação é relativa à imagem fornecida no momento. 0, 5 é nenhuma mudança, 0 é totalmente dessaturado e 1 é saturação completa.
  • A clareza também é relativa, com 0, 5 sendo nenhuma mudança, 0 como todos os pixels de preto e 1 como todos os pixels de branco.

Como alternativa, você pode usar -1.0 para qualquer um dos valores de HSL para especificar nenhuma mudança.