Agent Skills para que los agentes de programación diseñen interfaces distintivas, con dirección de arte, fotos reales y una revisión en el navegador, en lugar de páginas genéricas de IA.
Nutlope/hallmark
Un skill de diseño para Claude Code, Cursor y Codex que guía a los agentes de programación con IA para crear interfaces que no parezcan generadas por IA.
- Estrellas
- 30,386
- Forks
- 1,566
- Issues abiertos
- 49
- Último commit
- hace 2 meses
¿Qué es?
Hallmark es un skill de diseño que se integra con asistentes de programación con IA como Claude Code, Cursor y Codex. Ayuda al asistente a elegir la estructura de página según el brief, aplicar uno de veintiún temas y ejecutar una serie de cincuenta y siete comprobaciones para detectar patrones de diseño genéricos habituales en interfaces generadas por IA antes de entregar el resultado.
Además de crear interfaces nuevas, ofrece otros tres modos: auditar código existente en busca de los mismos antipatrones y devolver una lista de tareas pendientes, rediseñar una página conservando sus textos y su arquitectura de la información, y analizar una captura de pantalla o una URL para extraer su diseño, combinación tipográfica y color de referencia. El modo de análisis también puede generar un archivo portátil design.md para usarlo con otras herramientas de IA.
Se puede instalar con npx skills add o copiando el archivo SKILL.md y la carpeta references al directorio de skills o rules de la herramienta correspondiente. El proyecto tiene licencia MIT.
Funciones clave
- 01Elige la estructura general de la página según el brief antes de escribir código.
- 02Ofrece veintiún temas y un modo Custom para los briefs que no encajan con ningún tema.
- 03Ejecuta cincuenta y siete comprobaciones de antipatrones y una autocrítica antes de entregar el resultado.
- 04Audita código existente y devuelve una lista de tareas pendientes sin modificarlo.
- 05Extrae el diseño, la combinación tipográfica y el color de una captura de pantalla o URL y los guarda en design.md.
Casos de uso
- Pedirle a un asistente de programación con IA que cree una landing page o una interfaz de producto que no parezca genérica.
- Revisar un código base de front-end existente en busca de patrones de diseño habituales en interfaces generadas por IA.
- Rediseñar el aspecto de un sitio sin cambiar sus textos ni su estructura.
- Convertir un diseño que te gusta en un brief de diseño reutilizable con otras herramientas.
Inicio rápido
- 1
Instala la skill con npx
npx skills add nutlope/hallmark - 2
Abre tu herramienta de programación con IA (Claude Code, Cursor o Codex) y pídele que cree una interfaz; la skill se aplicará automáticamente
Antes de usarlo
- Es un conjunto de reglas de prompt para agentes de programación con IA, así que solo te servirá si ya utilizas una de las herramientas compatibles.
- La calidad del resultado depende del modelo de IA subyacente y del brief que le proporciones.
Temas
Preguntas frecuentes
- ¿Qué es hallmark?
- Un skill de diseño para Claude Code, Cursor y Codex que guía a los agentes de programación con IA para crear interfaces que no parezcan generadas por IA. Hallmark es un skill de diseño que se integra con asistentes de programación con IA como Claude Code, Cursor y Codex. Ayuda al asistente a elegir la estructura de página según el brief, aplicar uno de veintiún temas y ejecutar una serie de cincuenta y siete comprobaciones para detectar patrones de diseño genéricos habituales en interfaces generadas por IA antes de entregar el resultado.
- ¿hallmark es gratuito? ¿Qué licencia tiene?
- hallmark es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
- ¿hallmark sigue mantenido?
- Actualizado en los últimos 6 meses. El último commit de hallmark fue el 6 ago 2026.
- ¿Para qué puedo usar hallmark?
- Pedirle a un asistente de programación con IA que cree una landing page o una interfaz de producto que no parezca genérica. Revisar un código base de front-end existente en busca de patrones de diseño habituales en interfaces generadas por IA. Rediseñar el aspecto de un sitio sin cambiar sus textos ni su estructura. Convertir un diseño que te gusta en un brief de diseño reutilizable con otras herramientas.
- ¿Cómo se instala hallmark?
- Instala la skill con npx: npx skills add nutlope/hallmark Abre tu herramienta de programación con IA (Claude Code, Cursor o Codex) y pídele que cree una interfaz; la skill se aplicará automáticamente
- ¿Dónde consigo hallmark?
- El código fuente y las instrucciones de instalación están en GitHub: https://github.com/Nutlope/hallmark
Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.
Proyectos relacionados
Una skill para asistentes de programación que hace que los agentes de IA empiecen por la siguiente acción, con pasos numerados y sin relleno ni preámbulos.
Colección de skills para agentes que enseñan a asistentes de programación con IA reglas de animación, diseño de UI y desarrollo frontend basadas en la experiencia del autor en Vercel y Linear.
Una colección de más de 45 consejos prácticos para usar Claude Code, además de un script personalizado para la línea de estado y el plugin dx con habilidades para el trabajo diario de desarrollo.
Una skill de agente de IA que convierte artículos en prompts para crear portadas verticales 3:4 para cuentas oficiales de WeChat y Xiaohongshu, con opción de mantener la coherencia del rostro.
Una skill para agentes que hace que los agentes de programación con IA informen de los resultados de sus tareas en chino simplificado controlado, según los principios de ASD-STE100.