AI-WEB-STACK ; 19 skills de IA para crear páginas web

19 skills de IA para crear páginas web, ordenadas por el momento del proyecto en que se usan.

QUÉ ES UNA SKILL

Un documento que un agente de IA lee antes de ponerse a trabajar. No es un programa ni un prompt suelto: le impone un método ; qué mirar, qué decidir, qué está prohibido, cuándo parar.

La diferencia entre una web del montón y una de agencia casi nunca está en el modelo. Está en lo que se le dice al modelo antes de pedirle nada.

LO QUE REALMENTE SE COMPRA: EL ORDEN

Estas 19 skills no son una lista suelta. Están ordenadas por el recorrido real de un proyecto:

DIRECCIÓN → SISTEMA → IMAGEN DE REFERENCIA → CÓDIGO → AUDITORÍA

Decidir la dirección antes de elegir la paleta. Elegir la paleta antes de generar las imágenes. Generar las imágenes antes de escribir código. Al revés sale un resultado que hay que rehacer.

Descartar una dirección cuesta una imagen. Descartarla en código cuesta una tarde.

LAS 19, POR FASE

01 · DIRECCIÓN — 5 skills

Decidir qué debe parecer la web y por qué.

design-taste-frontend · design-taste-frontend-v1 · frontend-design · high-end-visual-design · gpt-taste

Anti-plantilla para landings y portfolios. Criterio de agencia cara: las fuentes, espaciados, sombras y animaciones concretas que hacen que una web parezca de presupuesto alto, y el bloqueo de los valores por defecto que la hacen parecer barata. Motion GSAP avanzado con ScrollTriggers.

02 · ESTILOS — 3 skills

Estéticas completas listas para adoptar.

minimalist-ui · industrial-brutalist-ui · stitch-design-taste

Editorial limpio de paleta monocroma cálida. Brutalista industrial: tipografía suiza cruzada con terminal militar, para dashboards densos y sitios editoriales. Y generación de DESIGN.md para Google Stitch.

03 · SISTEMA DE DISEÑO — 3 skills

Paleta, tipografía, tokens y componentes.

ui-ux-pro-max · design-system · ui-styling

ui-ux-pro-max trae una base de datos local y consultable con 67 estilos, 161 paletas, 57 emparejamientos tipográficos y 21 stacks: React, Next.js, Vue, Svelte, Astro, Tailwind, shadcn/ui, Angular, Laravel y más. Funciona sin conexión.

04 · DE IMAGEN A CÓDIGO — 2 skills

El flujo que más eleva el resultado.

imagegen-frontend-web · image-to-code

Una imagen de referencia separada por cada sección — ocho secciones, ocho imágenes, nunca comprimidas en un tablero. Después, programar la web contra esas imágenes.

05 · SITIO COMPLETO — 1 skill

10k-websites

De cero a publicado en once fases, con puertas de aprobación antes de cada paso que cuesta dinero. Construye una web cinemática de scroll: un vídeo hero avanza al bajar y retrocede al subir, y la página aterriza en un sitio real. HTML, CSS y JS planos, sin build, subible a cualquier hosting estático.

06 · AUDITORÍA Y REDISEÑO — 3 skills

Para lo que ya existe.

impeccable · redesign-existing-projects · design-is

impeccable es la más completa del pack: 148 ficheros y 22 verbos de operación sobre interfaz — audit, critique, typeset, layout, polish, harden, optimize, animate y catorce más. Revisa jerarquía, accesibilidad, responsive, motion, estados de error y casos límite.

07 · APOYO — 2 skills

brand · full-output-enforcement

Voz de marca para que el copy no suene a IA. Y una skill de 3 KB que anula el comportamiento por defecto de truncar: se acabó recibir media web con un "// resto del código igual".

QUÉ RECIBES

Un ZIP de 1,7 MB, descarga inmediata.

Las 19 skills en siete carpetas, ordenadas por el momento en que se usan.

Tres manuales:

· Catálogo — las 19 una por una, qué hace cada una y qué necesita

· Instalación — las cuatro rutas según tu plataforma, y los errores habituales

· Manual de uso — cinco flujos completos: landing desde cero, rediseñar lo que existe, sitio entero con vídeo hero, adoptar una estética, y solo el copy

Cada skill con su fichero de licencia y el nombre de su autor.

Actualizaciones incluidas.

QUÉ NECESITAS

12 de las 19 no necesitan nada externo. Se copian y funcionan.

Las otras 7 piden algo concreto — un modelo de imagen, ffmpeg, Node, GSAP — y está detallado skill a skill en el catálogo.

Ninguna te obliga a un modelo de IA concreto. Las que generan imagen funcionan con el que ya pagues.

Compatible con Claude Code, Codex y, pegando el contenido, cualquier chat de IA.

QUÉ ES ESTO EXACTAMENTE

Una selección curada. Las 19 skills las escribieron otras personas, están bajo licencia permisiva y cada una viaja con su licencia y la atribución de su autor.

Lo que aporta este pack es el trabajo de encontrarlas entre cientos, probarlas, auditar su procedencia, quitarles las rutas personales de quien las instaló, ordenarlas por el momento en que se usan y documentarlas.

Puedes usarlas en proyectos propios y de clientes, comerciales incluidos, y lo que crees con ellas es tuyo. Lo que no puedes es redistribuir el pack.

PARA QUIÉN NO ES

Si nunca has usado un agente de IA y no tienes intención de aprender, esto no te va a servir. Son instrucciones para una herramienta que hay que saber usar.

¿NECESITAS MÁS QUE WEB?

Este pack cubre web de principio a fin. Si además trabajas con imagen, vídeo, automatización o código, el pack completo — AI-CREATIVE-STACK — incluye estas 19 más otras 42: cuatro guías maestras de prompting, quince agentes de dirección creativa en español, un editor de reels verticales por lotes, y 35 skills de AI coding, research y memoria persistente.