Un tema es un tipo especial de extensión que cambia el aspecto del navegador. Los temas se empaquetan como las extensiones normales, pero no contienen código JavaScript ni HTML.
Los temas se suben a Chrome Web Store con el mismo procedimiento que una extensión. Durante la carga, se te pedirá que selecciones una categoría. Encontrarás una lista de categorías de temas en la documentación de Chrome Web Store en Prácticas recomendadas.
Puedes encontrar y probar muchos temas en Chrome Web Store.
Manifiesto
Este es un archivo manifest.json
de ejemplo para un tema:
{
"manifest_version": 3,
"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"
}
}
}
colores
Los colores están en formato RGB. Para encontrar las cadenas que puedes usar en el campo "colors", consulta kOverwritableColorTable
.
imágenes
Los recursos de imagen usan rutas de acceso relativas a la raíz de la extensión. Puedes anular cualquiera de las imágenes que especifican las cadenas en kPersistingImages
. Todas las imágenes deben almacenarse en formato PNG o no se renderizarán correctamente.
properties
Este campo te permite especificar propiedades como la alineación del fondo, la repetición del fondo y un logotipo alternativo. Para ver las propiedades y los valores que pueden tener, consulta kDisplayProperties
.
tonos
Puedes especificar los tonos que se aplicarán a partes de la IU, como los botones, el marco y la pestaña de fondo. Google Chrome admite tonos, no imágenes, porque las imágenes no funcionan en todas las plataformas y son inestables en el caso de agregar botones nuevos. Para encontrar las cadenas que puedes usar en el campo "tints", consulta kTintTable
.
Los tonos están en formato tono-saturación-luminosidad (HSL) y usan números de punto flotante en el rango de 0 a 1.0:
- El matiz es un valor absoluto, en el que 0 y 1 son rojos.
- La saturación es relativa a la imagen proporcionada actualmente. 0.5 es sin cambios, 0 es totalmente desaturado y 1 es saturación completa.
- El valor de luminosidad también es relativo, con 0.5 como sin cambios, 0 como todos los píxeles en negro y 1 como todos los píxeles en blanco.
Como alternativa, puedes usar -1.0
para cualquiera de los valores de HSL para especificar sin cambios.