Frontend y UI
Hallmark
Flujo de diseño anti-genérico con 58 puertas y variedad estructural forzada.
Qué es
Una skill de diseño para asistentes de código con IA, con un flujo de construcción por defecto y tres verbos: audit, redesign y study. Empuja hacia la variedad estructural para que dos construcciones no compartan un mismo ritmo de página.
Anti-AI-slop design skill for greenfield pages, audits, redesigns, and design extraction from URLs or screenshots. Use when the user asks to build a new app or landing page, wants to redesign something, invokes Hallmark
Por qué importa para el diseño
- Las reglas de diversificación fuerzan macroestructuras, navs y footers distintos entre construcciones consecutivas.
- Los tokens bloqueados prohíben valores hex o font-family en línea que se salten el bloque de tokens.
- Cada entrega se verifica en anchos de 320, 375, 414 y 768 píxeles.
Qué cubre
- How to use this skill
- Disciplines that hold across every verb
- When the brief is a component, not a page
- Design flow (default)
- Hallmark study
- Output contract and scope
Cómo instalarlo
Hallmark
-
Clona el repositorio.
git clone https://github.com/Nutlope/hallmark -
Señálale a Codex el archivo de la skill.
skills/hallmark/SKILL.md -
Luego describe la interfaz que quieres. Codex sigue la skill.
Cómo ejecutarlo con Codex
-
Deja que el escaneo previo lea primero las fuentes, la paleta y las librerías de movimiento existentes.
-
Responde la puerta de audiencia, caso de uso y tono, o di adelante.
-
Ejecuta hallmark audit sobre una página para obtener una lista priorizada de pendientes sin editar nada.
Todos los plugins de esta colección son gratuitos, de código abierto y enlazan a su fuente original real.
Más en la lista codex-design ↗Más plugins de diseño para Codex
Frontend y UI Qué hace gpt-taste Crea landing pages de estilo premiado con movimiento de scroll GSAP y rejillas bento sin huecos. 
Sistemas de diseño Qué hace Stitch Design Taste Escribe un DESIGN.md que orienta a Google Stitch hacia pantallas que no son genéricas. 
Frontend y UI Qué hace image-to-code Primero genera imágenes de diseño, las analiza y luego construye el código frontend correspondiente. 
Frontend y UI Qué hace imagegen-frontend-mobile Genera flujos de pantallas de apps móviles premium como imágenes, no como código. Siguiente paso
Diseña con Open Design, sin montar nada
Instálalo tú mismo, o ejecuta toda una capa de diseño curada alrededor de Codex con Open Design. Trae tu propia key: lo que produzcas es tuyo.