Frontend y UI

imagegen-frontend-web

Genera una imagen de referencia horizontal por cada sección de la landing page.

Qué es

Una skill de dirección de imagen para referencias de diseño de sitios web. Genera una imagen horizontal independiente por sección, con una única paleta fija y una composición de hero variada a lo largo del conjunto.

Elite frontend image-direction skill for generating premium, conversion-aware website design references. CRITICAL OUTPUT RULE — generate ONE separate horizontal image FOR EVERY section. A landing page with 8 sections pro
Del SKILL.md original

Por qué importa para el diseño

  • Una landing page de ocho secciones produce ocho comps legibles, no un único tablero comprimido.
  • La composición del hero varía más allá del típico texto a la izquierda, imagen a la derecha.
  • Una misma paleta, escala tipográfica y familia de CTA se mantiene en cada fotograma generado.

Qué cubre

  • Image count and page slicing
  • The combinatorial variation engine
  • Hero minimalism rules
  • Color and material rules
  • Multi-image consistency rule
  • Default site packs

Cómo instalarlo

imagegen-frontend-web

  1. Clona el repositorio.

    git clone https://github.com/Leonxlnx/taste-skill
  2. Señálale a Codex el archivo de la skill.

    skills/imagegen-frontend-web/SKILL.md
  3. Luego describe la interfaz que quieres. Codex sigue la skill.

Cómo ejecutarlo con Codex

  1. Di cuántas secciones quieres; si no lo indicas, la landing page usa seis por defecto.

  2. La skill anuncia el número, y luego etiqueta cada resultado por número de sección.

  3. Dale palabras de ambiente como editorial o cinematográfico para orientar la escala del hero y el fondo.

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 ↗

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.