Primeros pasos
Haz clic en el icono de Stylebot en la barra de herramientas y luego en Estilizar esta página. O pulsa alt+shift+M en cualquier pestaña, o haz clic derecho en un elemento y elige Stylebot → Dar estilo al elemento.
Haz clic en el selector de elementos, pasa el cursor por la página y haz clic en un elemento. Pulsa ↑ antes de hacer clic para seleccionar su elemento padre. Luego cámbialo en Básico o escribe CSS en Código. Los cambios se guardan a medida que los haces y se cargan cada vez que visitas el sitio.
- Fuentes
- Busca entre 400 Google Fonts y Stylebot carga la que elijas, o escribe cualquier fuente instalada en tu equipo.
- Posición del editor
- En Chrome y Edge, el editor se abre en el panel lateral. Usa Posición en su menú ⋯ para abrirlo en una ventana aparte o acoplarlo en la página. Firefox y Safari no tienen panel lateral.
- Desactivar un estilo
- Usa el interruptor de la ventana emergente o alt+shift+S. El estilo se conserva, solo que no se aplica.
Perfiles
Un perfil es una hoja de estilo aparte para el mismo sitio, así puedes tener más de un aspecto y cambiar entre ellos. Solo se aplica uno a la vez, y todos los sitios empiezan con Predeterminado.
Haz clic en el nombre del perfil junto al sitio, en la cabecera del editor, para crear, renombrar, duplicar o eliminar perfiles. Cambia entre ellos ahí o en la ventana emergente, donde Sin estilo desactiva el estilo en el sitio. Los perfiles nuevos empiezan vacíos.
Preajustes
La pestaña Preajustes tiene dos, y ambos se combinan con tus propios cambios. Legibilidad convierte los artículos de un sitio en una vista de lectura limpia, con tema, fuente, tamaño y ancho a tu elección; las páginas que no son artículos no se tocan. Escala de grises quita el color del sitio, con la intensidad que quieras.
Sincronización e historial de versiones
- Sincronización con Google Drive
- Conecta Google Drive en Opciones. Tus estilos, perfiles incluidos, se sincronizan cada 30 minutos y justo después de que edites. Stylebot solo ve los archivos que crea en tu Drive, y no hay ningún servidor de Stylebot.
- Conflictos
- Si un estilo cambió en dos equipos, se conserva tu edición más reciente y la otra versión se guarda en un comentario, así que no se pierde nada.
- Respaldo
- Exporta e importa todos tus estilos como JSON desde Opciones.
- Historial de versiones
- Cada cambio en este equipo se guarda en Opciones, incluidos los que llegan por sincronización. Restaura cualquier versión anterior, para algunos sitios o para todos.
Galería
La Galería reúne estilos que otras personas crearon con Stylebot. Previsualiza uno en el sitio para el que está hecho, lee su CSS e instálalo con un clic.
- Publicar un estilo
- Elige Publicar en la Galería en el menú ⋯ de un estilo, en la ventana emergente, o en el menú ⋯ del editor, e inicia sesión con Google. Tus cambios se quedan en tu ordenador hasta que publiques una actualización.
- Tus estilos
- Inicia sesión en la Galería para renombrar o eliminar los estilos que publicaste y para cambiar tu nombre de usuario.
Reglas de URL
De forma predeterminada, Stylebot asocia los estilos a los sitios web por nombre de dominio. Edita la URL de un estilo en Opciones y usa estos patrones para algo más específico.
**Coincide con cualquier secuencia de caracteres.*Coincide con cualquier secuencia de caracteres hasta encontrar una /.,Separa una lista de patrones. Una URL coincide si coincide cualquiera de los patrones.^Al principio de una URL, la convierte en una expresión regular.Ejemplos
docs.google.com- El dominio docs.google.com o cualquiera de sus subdominios.
docs**- Cualquier URL que empiece por docs.
docs*.google.com- docs.google.com, docs1.google.com, docs2.google.com, etc.
*.ycombinator.com- news.ycombinator.com y apps.ycombinator.com.
docs.google.com, spreadsheets.google.com- Cualquiera de los dos dominios o sus subdominios.
^http://www.reddit.com/$- Solo la página principal de Reddit.
*- Todos los sitios. Útil para estilos que quieres en todas partes.
CLI
El comando stylebot permite que un agente de programación como Claude Code, Codex o Cursor cambie el estilo de los sitios directamente en tu navegador, con tu propia suscripción en lugar de una clave de API. También puedes ejecutar los comandos tú mismo.
- Configuración
- Instala la CLI, conéctala a tus navegadores y luego activa Permitir el acceso desde la línea de comandos en Opciones. La página de la CLI explica cada paso. Por ahora, solo en Chrome y Edge.
- Claude Code
- Añade el plugin de Stylebot y pide un cambio con
/stylebot, como un tema oscuro para un sitio. - Privacidad
- El acceso a la CLI está desactivado hasta que lo activas. Stylebot y la CLI solo se comunican entre sí, en este equipo; un agente envía lo que lee a su propio proveedor.
Atajos de teclado
Los atajos globales funcionan en cualquier página a la que Stylebot pueda dar estilo; cámbialos en los ajustes de atajos del navegador, enlazados desde Opciones. Para ver los atajos del propio editor, pulsa ? en el editor.
Ayuda y soporte
¿Encontraste un error o tienes una idea? Abre un issue en GitHub. Stylebot es gratis y de código abierto, y se mantiene desde 2011. Si te resulta útil, puedes apoyarlo invitándome a un café.