Nuevo sistema de temas en DbGate

Published: 2026-01-23

Durante varios años, DbGate mantuvo el mismo sistema de temas. Con la versión 7.0.0, hemos introducido un sistema de temas completamente nuevo basado en archivos JSON. Lamentablemente, los temas personalizados antiguos implementados como plugins ya no son compatibles.

Apreciamos profundamente que los miembros de la comunidad de DbGate hayan creado temas para DbGate, y lamentamos que los temas creados anteriormente ya no vayan a ser compatibles. Por eso pospusimos esta decisión durante mucho tiempo. Sin embargo, a medida que pasa el tiempo, la imposibilidad de evolucionar el diseño se volvió cada vez más insostenible. Finalmente decidimos hacer un cambio radical y renovar por completo el sistema de temas.

En este artículo, explicaré por qué hicimos este cambio y cómo funciona el nuevo sistema de temas.

Sistema de temas congelado en DbGate hasta la versión 6.x

DbGate tuvo un sistema de temas relativamente simple hasta la versión 6.x. Utilizaba un pequeño número de variables CSS para definir colores. Estas variables CSS no estaban relacionadas con elementos específicos de la interfaz de usuario, sino que eran más genéricas (como --font-color-1, --font-color-2, --background-color-1, --background-color-2, etc.). Aunque este sistema facilitaba la creación de nuevos temas, era bastante limitado. No era posible definir estilos para elementos específicos de la interfaz de forma independiente. El sistema también congelaba el diseño de la aplicación, porque cambiar una variable CSS de color afectaba a toda la aplicación en lugar de a partes específicas.

Temas basados en elementos en DbGate 7.0.0

En DbGate 7.0.0, introdujimos un sistema de temas completamente nuevo basado en archivos JSON. En el nuevo sistema, cada elemento de la interfaz de usuario tiene su propio conjunto de variables CSS que definen colores, bordes y otras propiedades de estilo. Esto proporciona mucha más flexibilidad a la hora de definir temas. El tema ahora se define mediante muchas más variables CSS, cada una relacionada con elementos específicos de la interfaz de usuario (como --data-browser-font-color, --data-browser-background-color, --button-font-color, --button-background-color, etc.).

En la era del contenido generado por IA, queríamos facilitar la creación de temas personalizados usando IA, lo que requería un control más detallado sobre la apariencia de la aplicación. Además, con la IA capaz de encargarse de este trabajo, el coste de mantener más variables CSS se ha vuelto insignificante, mientras que los beneficios en términos de flexibilidad de diseño son significativos.

Documentación de temas personalizados

Generar temas con IA

La edición DbGate Premium incluye una nueva función de asistente de temas con IA. Esta función permite a los usuarios crear temas personalizados usando IA. Simplemente describe tu tema deseado en lenguaje natural, y el asistente de IA generará un tema basado en tu descripción. También puedes modificar el tema generado simplemente describiendo los cambios que quieres hacer.

Compartir temas a través de DbGate Cloud

Hemos mejorado la base de conocimiento pública de DbGate para admitir el intercambio de temas personalizados. Solo tienes que crear tu tema (definir las variables CSS en un archivo JSON). Puedes inspirarte en el tema Solarized light código fuente. Recomendamos usar el asistente de IA para crear la primera versión de tu tema. Para publicarlo, solo crea una pull request en el repositorio de la base de conocimiento pública de DbGate. Después de hacer el merge, tu tema estará disponible para todos los usuarios de DbGate en el selector de temas (también con una vista previa basada en los colores de tu tema).