Temas / Crea el tuyo

HAZLO TUYO

Crea tu propio tema.

Un tema de PixelyChat es un único archivo pequeño. No necesitas programar: describe el aspecto que quieres, deja que un asistente de IA como Claude o ChatGPT modifique un tema existente y luego importa el resultado.

¿Prefieres cambiar el aspecto del chat? Crea un estilo de chat ↓

1. Consigue un punto de partida

Un archivo .pixelytheme es un archivo ZIP normal con otro nombre. Si tu chat con IA rechaza la subida, cambia el nombre del archivo a .zip. Cada paquete contiene un README.md que explica el formato a la IA.

2. Pídeselo a la IA

Usa un asistente que pueda leer archivos subidos y devolverte un archivo (Claude con creación de archivos o ChatGPT con subida de archivos y ejecución de código). Adjunta el archivo del tema, pega este prompt y completa la parte marcada:

He adjuntado un tema de PixelyChat (un archivo .pixelytheme, que es un archivo ZIP; si no puedes abrirlo, trátalo como .zip). Conviértelo en mi propio tema nuevo.

PRIMERO descomprímelo y lee README.md: es la guía oficial del formato de temas de PixelyChat y enumera todos los hooks CSS. Después lee theme.json, theme.css y fields.json.

EL ASPECTO QUE QUIERO:
[Describe aquí tu tema: ambiente, colores, formas, fuentes, animaciones. Ejemplo: «Synthwave neón: paneles morado oscuro, detalles rosa intenso y cian, bordes luminosos y un brillo pulsante lento en las alertas».]

REGLAS
- theme.json: dale un “id” nuevo y único (letras minúsculas, números y guiones) y un “name” nuevo. Establece “author” como {"name": "[TU NOMBRE]", "type": "creator"}, “version” como “1.0.0” y añade “released” con la fecha de hoy en formato YYYY-MM-DD. Conserva los demás campos, incluidos “basedOn” y “supports”.
- Los temas solo modifican la apariencia: CSS, JSON y archivos incluidos. Nada de JavaScript, @import ni URLs externas. Las imágenes y fuentes deben estar dentro de assets/ y referenciarse con rutas relativas.
- Da estilo a todas las áreas incluidas en “supports” (alertas, recompensas, widgets y pantallas Starting Soon / Be Right Back / Shoutout). Mantén el texto legible sobre cualquier fondo del stream y asegúrate de que funcione tanto en diseños horizontales como verticales.
- Mantén el paquete pequeño. Usa únicamente imágenes, fuentes y sonidos que tenga permiso para utilizar. Si el preview.webp anterior ya no coincide con el nuevo aspecto y no puedes generar uno nuevo (WebP pequeño, aprox. 1280x720 y menos de 150 KB), elimínalo.
- Empaquétalo: comprime el CONTENIDO de la carpeta del tema para que theme.json quede en el nivel superior del archivo (no dentro de una subcarpeta) y llama al archivo [id].pixelytheme.

Cuando termines, dame el archivo .pixelytheme final para descargar y enumera lo que cambiaste y cualquier cosa que no hayas podido comprobar.

3. Impórtalo y pruébalo

  1. Descarga el archivo que te dé la IA.
  2. En PixelyChat abre Tema de escena y haz clic en Importar tema.
  3. Comprueba la vista previa y después tus alertas, widgets y pantallas. ¿Aún no está bien? Dile a la IA qué debe cambiar —las capturas ayudan— e importa el nuevo archivo; PixelyChat te ofrecerá actualizar el tema que ya tienes instalado.
  4. Los temas que importes se pueden borrar cuando quieras; los temas integrados permanecen.

4. Compártelo (opcional)

¿Te gusta el resultado? Envía el archivo .pixelytheme a [email protected] con el nombre que quieras mostrar como autor. Haremos una revisión parcial y, si encaja, lo añadiremos a la Biblioteca de temas para todos.

Envía únicamente contenido que tengas derecho a compartir. Al enviar un tema confirmas que lo has creado tú o que tienes derecho a distribuirlo y que no contiene material protegido por derechos de terceros (imágenes, fuentes, sonidos, logotipos o personajes) sin permiso. Los temas enviados son contenido creado por usuarios y PixelyChat solo los revisa parcialmente; el autor sigue siendo responsable de su contenido y podemos retirar cualquier tema en cualquier momento.

ESTILOS DE CHAT

Crea tu propio estilo de chat.

Un estilo de chat cambia cómo se ven los mensajes en el overlay del chat: etiquetas de nombre, tarjetas, bordes, insignias y decoraciones. Funciona como un tema: un pequeño archivo .pixelystyle, y un asistente de IA puede crearlo por ti.

1. Elige un punto de partida

Un archivo .pixelystyle es un archivo ZIP normal con otro nombre. Si tu chat de IA rechaza la subida, cambia la extensión a .zip. Cada paquete incluye un README.md que explica el formato a la IA.

2. Pídeselo a la IA

Adjunta el archivo del estilo, pega este prompt y completa la parte marcada:

Adjunté un estilo de chat de PixelyChat (un archivo .pixelystyle, que es un archivo ZIP; si no puedes abrirlo, trátalo como .zip). Conviértelo en mi propio estilo de chat nuevo.

PRIMERO descomprímelo y lee README.md: es la guía oficial del formato de estilos de chat de PixelyChat, con la estructura de los mensajes, todas las clases y atributos data y las variables CSS. Después lee chat-style.json, style.css y fields.json.

EL ASPECTO QUE QUIERO:
[Describe aquí tu estilo de chat: ambiente, colores, formas, etiquetas de nombre, insignias, decoraciones. Ejemplo: "Otoño acogedor - tarjetas marrones cálidas, etiquetas de nombre naranjas, una hojita en la esquina de cada mensaje y un icono de hoja de arce para los mods."]

REGLAS
- chat-style.json: dale un "id" nuevo y único (letras minúsculas, números y guiones) y un "name" nuevo. Pon "author" como {"name": "[TU NOMBRE]"}, "version" como "1.0.0" y añade "released" con la fecha de hoy en formato YYYY-MM-DD. Mantén "format", "schemaVersion" y "styleApiVersion".
- Los estilos de chat solo cambian la apariencia: CSS, JSON y archivos incluidos. Nada de JavaScript, @import ni URL externas. Las imágenes y fuentes deben estar en assets/ y usarse con rutas relativas.
- Usa las variables CSS de fondo, esquinas, borde y color de acento (listadas en README.md) siempre que tenga sentido, para que los ajustes del estilo en PixelyChat sigan funcionando. Pinta las decoraciones con el color de acento (SVG de un solo color usados como máscara) para que sigan el color del streamer.
- Da estilo a todos los tipos de mensaje: mensajes normales de cada rol (streamer, mod, VIP, sub, espectador), mensajes solo con emotes y eventos (follows, subs, regalos, raids...). El texto debe leerse bien sobre cualquier fondo del stream.
- Mantenlo ligero: sin animaciones en bucle, sin backdrop-filter ni blur, y como mucho una animación de entrada corta. Mantén el paquete pequeño (5 MB como máximo). Usa solo imágenes y fuentes que yo pueda usar. Si el preview.webp antiguo ya no coincide con el nuevo aspecto y no puedes generar uno nuevo (WebP pequeño, unos 960x540, menos de 150 KB), elimínalo.
- Empaquétalo: comprime el CONTENIDO de la carpeta del estilo para que chat-style.json quede en el nivel superior del archivo (no dentro de una subcarpeta), deja fuera la carpeta dev/ y nombra el archivo [id].pixelystyle.

Cuando termines, dame el archivo .pixelystyle final para descargarlo y enumera lo que cambiaste y lo que no pudiste comprobar.

3. Impórtalo y pruébalo

  1. Descarga el archivo que te dé la IA.
  2. En PixelyChat abre Chat → Estilo → Biblioteca de estilos y haz clic en Importar estilo.
  3. Selecciona el estilo en Overlay y revisa la vista previa. Los ajustes de fondo, esquinas, borde y color de acento también funcionan con él. ¿Todavía no está bien? Dile a la IA qué cambiar (las capturas ayudan) e importa el archivo nuevo: PixelyChat te ofrecerá actualizar el estilo que ya instalaste.
  4. Mantenlo ligero: los mensajes están en pantalla durante todo tu stream, así que las animaciones en bucle y el blur cuestan rendimiento en OBS.

4. Compártelo (opcional)

¿Te gusta el resultado? Envía el archivo .pixelystyle (5 MB como máximo) a [email protected] con el nombre que quieres mostrar como autor. Hacemos una revisión parcial y, si encaja, lo añadimos a la biblioteca de estilos de chat para todos.

Envía solo lo que puedas compartir. Al enviar un estilo de chat confirmas que lo creaste tú o que tienes derecho a distribuirlo, y que no contiene material protegido de terceros (imágenes, fuentes, logotipos, personajes) sin permiso. Los estilos de chat enviados son contenido creado por usuarios y PixelyChat solo los revisa parcialmente; el autor sigue siendo responsable de su contenido y podemos retirar cualquier estilo en cualquier momento.