¿Quieres llevar la personalización de tu navegador al siguiente nivel? Te mostraré cómo crear tu propia configuración para cambiar el tema del navegador a tu color favorito.
Crear una extensión para cambiar el tema del navegador puede sonar complicado, ¡pero te prometo que no lo es!. Basta con configurar un archivo con los colores que prefieres.
¡Vamos a empezar!
Configurar en local
Los siguientes pasos te guiaran para crear la configuración y probarlo en tu navegador:
- Crear una carpeta para guardar los archivos de configuración
- Crear un archivo llamado manifest.json y agrega el siguiente contenido utilizando tu editor de código favorito:
{
"manifest_version": 3,
"name": "Simple Theme demo 1",
"version": "1.0",
"theme": {
"colors": {
"background_tab": [255, 0, 0],
"background_tab_inactive": [0, 255, 0],
"background_tab_incognito": [0, 0, 255],
"background_tab_incognito_inactive": [255, 255, 0],
"bookmark_text": [255, 0, 255],
"button_background": [0, 255, 255],
"frame": [128, 128, 128],
"frame_inactive": [255, 128, 0],
"frame_incognito": [128, 255, 0],
"frame_incognito_inactive": [0, 128, 255],
"ntp_background": [255, 0, 128],
"ntp_header": [0, 255, 128],
"ntp_link": [128, 0, 255],
"ntp_text": [255, 255, 255],
"omnibox_background": [0, 128, 128],
"omnibox_text": [128, 128, 0],
"tab_background_text": [0, 0, 128],
"tab_background_text_inactive": [0, 128, 0],
"tab_background_text_incognito": [128, 0, 0],
"tab_background_text_incognito_inactive": [128, 128, 128],
"tab_text": [255, 255, 0],
"toolbar": [255, 0, 64],
"toolbar_button_icon": [0, 255, 64],
"toolbar_text": [64, 0, 255]
}
}
}
- Modificar por los colores en RGB que más te gusten
- Abrir en Google Chrome la siguiente url chrome://extensions/
- Seleccionar la opción de Cargar extensión sin empaquetar
- Seleccionas la carpeta que creaste anteriormente
- Ver como se ve la configuración que creaste