Instalar el plugin Weblify de Figma

1. Abre cualquier archivo de Figma.
2. Haz clic en el icono Actions de la barra de herramientas inferior de Figma.
3. Haz clic en la pestaña Plugins & Widgets para ver solo plugins de Figma.
4. Busca Weblify en la barra de búsqueda.
5. Haz clic en el resultado Weblify.
6. Haz clic en el botón Save para instalar el plugin Weblify.

Si formas parte de una Figma Organization, es posible que solo puedas instalar plugins aprobados. Si no puedes instalar algunos plugins de Figma, pide al administrador de la organización de Figma de tu empresa que apruebe el plugin Weblify.

Ejecutar el plugin Weblify de Figma

Cuando hayas instalado el plugin Weblify de Figma, sigue estos pasos para ejecutarlo en tu archivo de Figma:

1. Haz clic derecho en cualquier parte del lienzo de la página de tu archivo de Figma
2. Pasa el ratón por encima del elemento de menú Plugins ▶
3. Pasa el ratón por encima del elemento de menú Saved plugins ▶
4. Haz clic en el elemento de menú del plugin Weblify

Después de ejecutar el plugin Weblify una vez en un archivo de Figma, podrás volver a abrirlo rápidamente haciendo clic en el icono de Weblify de la columna derecha de Figma (bajo el subtítulo Plugin).

Solo los usuarios de Figma con acceso de Edit a un archivo de Figma pueden ejecutar plugins de Figma en ese archivo; si solo tienes permisos de View, no podrás ejecutar ningún plugin de Figma en ese archivo.

Instalar y activar Weblify

Instalar y ejecutar el plugin de Figma

Cómo ejecutar Weblify dentro de Figma

Activar Weblify Pro

Cómo comprar y usar una clave de licencia Pro

Usar Weblify

Crear un sitio web

Crea páginas web editables a partir de plantillas, secciones y elementos

Importar un sitio web

Copia una página o un elemento seleccionado con la extensión de Chrome gratuita

Auditar y exportar

Valida y descarga un sitio web estático en HTML y CSS

Inspeccionar capas de Figma

Genera código HTML, Tailwind, React o Vue a partir de una capa seleccionada

Preguntas frecuentes

Solución de problemas de Weblify

Problemas habituales con los que te puedes encontrar

Seguridad de Weblify

Detalles sobre cómo funciona Weblify

Recibos

Encuentra los recibos por email y las facturas en PDF

Facturación

Gestiona tu suscripción Pro

Gestión de puestos de la licencia

Gestiona los usuarios de Figma de tu clave

Weblify gratis y Pro

Compara las funciones gratis y Pro

Funciones de Weblify

• Crea páginas web editables a partir de plantillas, secciones, elementos y layouts responsive.
• Copia sitios web públicos o con sesión iniciada en Figma con la extensión de Chrome gratuita.
• Previsualiza el sitio web generado con distintos anchos de viewport.
• Audita y exporta las páginas de Weblify como un sitio web estático en HTML y CSS.
• Inspecciona las capas de Figma seleccionadas como código HTML/CSS, Tailwind, React o Vue.
• Copia el código generado o descarga un ZIP del componente con sus recursos de imagen.
• Trabaja con el Auto Layout de Figma, el ajuste de línea (wrapping) y las propiedades de layout mín./máx.
• Usa las herramientas de inspección de código de Weblify desde el Dev Mode de Figma.