Cómo usar Impeccable en Codex y Claude Code.

Impeccable le da a tu agente de programación un vocabulario de diseño: comandos como bolder, quieter, critique y polish, además de un detector que señala patrones de IA sin llamar a un modelo. Funciona mejor con interfaces que ya tienes. Este tutorial explica cómo instalarlo en Codex y Claude Code, cómo configurarlo para tu proyecto, qué comandos conviene aprender primero y qué ajustes revisar antes de activarlo todo.

Actualizado el 6 de noviembre de 2026 · 8 min de lectura

Qué es Impeccable

Impeccable es una skill de diseño de código abierto (Apache 2.0) de Paul Bakaus. Nació a partir de la skill frontend-design de Anthropic y creció hasta convertirse en dos cosas: 24 comandos con nombre, desde movimientos de diseño como bolder y quieter hasta revisiones como critique y audit, y un detector determinista con 62 reglas para señales de IA y problemas de calidad. La versión 4.8 funciona con Codex, Claude Code, Cursor, GitHub Copilot, Gemini CLI y muchos otros agentes.

Instálalo

Desde la carpeta raíz de tu proyecto:

npx impeccable install

El instalador detecta tus herramientas de programación, te pregunta si instalarlo para este proyecto o para todos, y ofrece un hook de diseño que revisa cada archivo de UI que edita el agente. Después, reinicia tu herramienta.

Codex: abre /hooks y aprueba el hook del proyecto; si no, no se ejecutará. Hazlo de nuevo después de una actualización que cambie el hook. En Codex llamas a la skill con $impeccable (o desde /skills) en lugar de con un comando de barra.
Claude Code: el instalador funciona aquí también. O añade el plugin con /plugin marketplace add pbakaus/impeccable y luego instala Impeccable desde /plugin.

Node solo hace falta para ejecutar npx. La skill ejecuta un pequeño motor que se descarga una vez en ~/.impeccable/bin/. Ejecuta npx impeccable update para actualizar.

Configúralo para tu proyecto

Ejecuta init una vez por proyecto:

$impeccable init      # Codex
/impeccable init      # Claude Code and most other agents

Lee tu código, pregunta solo lo que no puede deducir (para quién es el producto, qué debe hacer y las restricciones) y escribe PRODUCT.md. Todos los comandos posteriores leen ese archivo. Si tu app ya tiene un estilo visual, ejecuta document a continuación para recogerlo en DESIGN.md, de modo que los cambios posteriores sigan fieles a la marca. Conserva los dos archivos en tu repositorio.

Empieza con un componente

Impeccable funciona mejor con un objetivo acotado: una sección revisada de cerca vale más que una página entera vista de pasada. Indica un comando y un objetivo:

/impeccable critique the pricing cards
/impeccable quieter the landing page hero
/impeccable typeset the settings page
/impeccable polish checkout

En Codex, escribe $impeccable en lugar de /impeccable. También puedes limitarte a describir lo que quieres, como “rehaz esta sección hero”.

Los comandos que conviene aprender primero

Grupo	Comandos	Úsalos para
Guiar	`bolder`, `quieter`, `distill`, `colorize`, `typeset`, `layout`, `animate`, `delight`, `overdrive`	Empujar una parte del diseño en una dirección clara
Revisar	`critique`, `audit`	Obtener una revisión de UX con puntuación, o un informe técnico clasificado de P0 a P3
Terminar	`polish`, `harden`, `clarify`, `adapt`, `optimize`, `onboard`	Pase final, casos límite, textos, tamaños de pantalla, velocidad, estados de primer uso
Iterar	`live`, `generate`	Probar variantes de un elemento en el navegador
Configurar	`shape`, `init`, `document`, `extract`	Planificar la UX, escribir los archivos de contexto, llevar patrones repetidos a tu sistema

Un buen primer ciclo: haz una critique de una pantalla, corrige el problema principal con un comando de guía como quieter o typeset y termina con polish. Escribe /impeccable a secas para ver la lista completa en tu agente, y fija el que uses a menudo con /impeccable pin audit.

Ejecuta el detector de AI slop

El detector comprueba 62 reglas, 31 de señales de IA y 31 de calidad, y no necesita ningún modelo ni clave de API:

npx impeccable detect src/                   # scan your source files
npx impeccable detect http://localhost:5173  # scan a rendered page in Chrome or Edge
npx impeccable detect --github src/          # annotations for GitHub Actions
npx impeccable detect --list-rules           # list every rule

Los archivos de código reciben las reglas de patrones; las reglas que necesitan una página renderizada, como el contraste bajo y el texto diminuto, solo se ejecutan cuando analizas una URL, así que apúntalo también a tu servidor de desarrollo. Termina con el código 2 cuando encuentra problemas, lo que facilita hacer fallar una comprobación de CI. Si la fuente de tu marca está en su lista de fuentes sobreutilizadas, permítela con npx impeccable ignores add-value overused-font Inter --reason "Brand font".

Revisa primero estos ajustes

Los hooks se ejecutan fuera de la aprobación del modelo en Claude Code. Un hook instalado se ejecuta incluso cuando deniegas los comandos del modelo, así que la primera edición puede descargar el motor. Revisa los hooks antes de ejecuciones desatendidas.
El modo live puede ejecutar un agente sin aprobaciones. Cuando aplicas ediciones en modo live y no hay ninguna sesión de chat escuchando, arranca la CLI de codex o claude con las aprobaciones y el sandbox desactivados. Define IMPECCABLE_LIVE_COPY_AGENT=chat antes de iniciar el modo live para mantenerlo en tu chat, u off para desactivarlo.
Telemetría. Los diseños nuevos obtienen direcciones visuales del catálogo de impeccable.style. Desactivar la telemetría (npx impeccable telemetry off o DO_NOT_TRACK=1) detiene el registro anónimo de qué dirección elegiste, pero no esa petición.
¿Algo no funciona? /impeccable doctor encuentra archivos de contexto obsoletos y hooks rotos.

Preguntas frecuentes

¿Impeccable es gratis?

Sí. Es de código abierto con licencia Apache 2.0.

¿Impeccable funciona con Codex?

Sí. Ejecuta npx impeccable install, aprueba el hook del proyecto en /hooks y llámalo con $impeccable.

¿Impeccable puede diseñar apps móviles?

Sí. Cubre pantallas de apps además de sitios web, con referencias para iOS y Android. Para ver una comparación lado a lado con otras opciones, consulta Taste Skill vs Impeccable vs UI UX Pro Max.