Layout.dev: la herramienta que convierte diseños en código con IA (y cuánto cuesta)

Layout.dev es una herramienta no-code/low-code que usa IA para transformar ideas visuales —un boceto, una captura de pantalla o una descripción en texto— en diseños web o interfaces listas. La idea es acortar ese salto doloroso entre ‘tengo una idea en la cabeza’ y ‘tengo algo que puedo mostrar o publicar’. Para un emprendedor que no es diseñador ni dev, es una forma de maquetar una landing o un prototipo sin contratar a nadie de entrada. Nota honesta: es una herramienta de nicho y relativamente nueva, así que su alcance y estabilidad no están al nivel de players grandes del mercado.

El workflow típico es plug-and-play: le das un input (sube una imagen de referencia, un wireframe o escribe un prompt describiendo lo que quieres) y la IA genera una propuesta de layout editable. Desde ahí ajustas elementos en un editor visual tipo dashboard, iteras con más prompts y exportas el resultado (código o diseño) para llevarlo a tu sitio o a tu stack de desarrollo. El setup inicial es rápido y la curva de entrada es amigable para quien viene de Figma o Canva.

El pricing exacto de Layout.dev no lo tengo confirmado y puede haber cambiado, así que tómalo como referencia y verifícalo en su sitio oficial antes de pagar. En este tipo de herramientas de diseño-a-código con IA suele haber un free tier limitado (créditos o proyectos contados) y planes de pago mensuales en el rango de ~$10 a $40 USD al mes según funciones y volumen. Tip para MX: casi siempre cobran en dólares vía tarjeta internacional, así que considera el tipo de cambio y la comisión de tu banco en el costo real.