🧩 Qué es theme-factory
Un toolkit para aplicar un tema a artifacts. Funciona con diapositivas, documentos, informes y landing pages HTML, y aplica una identidad visual coherente: paleta de colores y pares de fuentes seleccionados.
theme-factory entiende que la estética importa tanto como el contenido. Ofrece 10 temas predefinidos con combinaciones de colores y fuentes cuidadosamente seleccionadas, cada uno con una identidad visual distinta, y te permite generar un tema completamente nuevo describiendo lo que quieres.
Cada tema vive en un archivo de especificaciones del directorio themes/, con una paleta hex completa y pares de fuentes complementarias.
- ✓ Skill para aplicar temas: colores + fuentes + identidad
- ✓ 10 temas predefinidos con muestra en PDF
- ✓ Generación de temas personalizados sobre la marcha a partir de una descripción
- ✓ Funciona con cualquier artifact: diapositivas, documentos, HTML, informes
- ✗ No crea el artifact en sí; solo lo estiliza
- ✗ No es un sistema de diseño completo con componentes
- ✗ No sustituye las brand-guidelines de una marca específica
- ✗ No automatiza la generación de imágenes o íconos
🎣 Cuándo Claude activa theme-factory
El skill se activa cuando la solicitud implica aplicar un estilo o tema a un artifact existente o nuevo con colores y fuentes coherentes.
La descripción de la skill es: "Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors/fonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly." Claude interpreta pedidos de "aplicar un tema", "hacerlo más bonito", "usar una paleta" o "darle estilo" como activadores directos.
"Aplica el tema Ocean Depths a esta diapositiva", "quiero un estilo dark elegante", "usa el tema Tech Innovation"
"Dale a este informe un aspecto más profesional", "mejora el aspecto de esta landing page", "necesita una identidad visual"
"Crea un tema con tonos vino y tipografía elegante", "quiero un tema forestal moderno para mi startup"
Slides o docs existentes que el usuario quiere unificar visualmente antes de presentar
Si el producto o tema está presente → genera de inmediato. Si no → haz UNA pregunta concreta y luego genera. Nunca hagas demasiadas preguntas. Las decisiones creativas que el usuario no haya especificado quedan a cargo de la skill.
🚀 Cómo mejora tus artifacts
La coherencia visual convierte un buen contenido en una presentación memorable. theme-factory te ofrece eso sin que tengas que ser diseñador.
- • Colores predeterminados del navegador (azul para enlaces, negro para texto)
- • Fuente genérica (Arial, sans-serif)
- • Inconsistencia entre secciones
- • Parece un borrador, no un producto
- • Paleta marítima coherente desde el título hasta el pie de página
- • Par tipográfico armonioso seleccionado
- • Cada elemento tiene un color intencional
- • Parece un producto terminado, listo para presentar
El skill hace referencia a un theme-showcase.pdf con los 10 temas visualizados. Pídele a Claude que muestre la galería antes de elegir, así decides basándote en una referencia visual real y no solo en el nombre.
⚙️ Cómo funciona por dentro
El proceso de aplicación del tema sigue pasos definidos: elegir → leer el archivo de especificaciones → aplicar de forma coherente en todo el artefacto.
Claude presenta las opciones o el usuario nombra una directamente. Si ninguna de las 10 sirve, empieza una creación personalizada.
themes/<nome>Cada tema tiene un archivo de especificaciones en el directorio themes/ con la paleta completa en hex y un par de fuentes. Claude lee este archivo antes de aplicarlo.
Los colores y las fuentes se aplican de manera uniforme: fondo, textos, bordes, botones y elementos destacados. Se mantienen el contraste y la legibilidad.
El tema se propaga por todos los elementos para crear una experiencia visual unificada de principio a fin.
Cuando ninguno de los 10 temas sirve, Claude genera un tema nuevo basándose en los datos del usuario. El tema recibe un nombre descriptivo, se muestra para revisión/aprobación y luego se aplica. El proceso refleja la estructura de los temas existentes.
💬 Ejemplo práctico + prompts listos
Escenarios reales de uso de theme-factory, con prompts que puedes copiar y pegar directamente en Claude Code.
Siempre que pidas un tema personalizado, Claude te lo mostrará para que lo apruebes antes de aplicarlo. Así evitas retrabajo: validas los colores y las fuentes en modo borrador y solo entonces pasas al artifact completo.
- ✓ Nombra el tema directamente ("Ocean Depths")
- ✓ Describir el mood ("oscuro elegante", "natural orgánico")
- ✓ Mencionar el contexto del artifact («diapositivas de ventas»)
- ✓ Pedir una revisión antes de la aplicación final
- ✗ Pedir un tema sin tener un artifact al que aplicarlo
- ✗ Mezclar dos temas al mismo tiempo en el mismo artifact
- ✗ Usar theme-factory para logos o íconos (no es su ámbito)
- ✗ Ignorar la revisión del tema personalizado antes de aplicarlo
🧬 Combina con / límites
theme-factory destaca cuando se combina con otros skills, especialmente brand-guidelines y frontend-design, y tiene límites claros cuando la identidad visual ya está definida.
O theme-factory es excelente cuando cualquier tema atractivo sirve. El brand-guidelines entra en juego cuando tienes una marca específica con colores y fuentes institucionales definidos: logo propio, manual de identidad visual, reglas de uso. Usa theme-factory para prototipos y materiales internos; brand-guidelines cuando el resultado vaya dirigido a clientes o represente oficialmente a la marca.
theme-factory define la paleta y las fuentes. El frontend-design implementa este sistema en componentes React/Tailwind/shadcn: botones, tarjetas, encabezados y formularios. Juntos cubren todo, desde lo visual hasta el código: tema → sistema de diseño → componentes de producción.
Después de definir un tema, canvas-design usa los mismos colores y fuentes para crear composiciones artísticas — banners, thumbnails, covers. La consistencia visual se extiende más allá de los documentos.
-
✗
Marca con identidad prescrita: si la empresa ya tiene un manual de marca con códigos hex definidos, usa brand-guidelines directamente — no tiene sentido elegir uno de los 10 temas.
-
✗
Artifact con el tema correcto ya aplicado: si el documento ya está estilizado y es coherente, aplicar otro tema sobrescribirá decisiones intencionales.
-
✗
Necesidad de animación o motion design: para eso, animation-designer o remotion son los skills adecuados.
📋 Resumen del Módulo 2.1
- ✓ theme-factory es un toolkit para dar estilo a slides, docs, informes y landing pages HTML
- ✓ 10 temas predefinidos: Ocean Depths, Midnight Galaxy, Tech Innovation y otros 7
- ✓ Cada tema define una paleta hex + un par de fuentes en un archivo del directorio
themes/ - ✓ Temas personalizados generados al instante a partir de una descripción + revisión antes de aplicarlos
- ✓ Usa brand-guidelines cuando tengas una marca específica con una identidad definida
- ✓ Combina con frontend-design (implementación) y canvas-design (composiciones)