Cómo importar un diseño Figma a su sitio web

Ve al panel de control de Figma y haz clic en tu foto de perfil → Configuración.

En la pestaña Cuenta, desplácese hasta la sección "Tokens de acceso personal" e introduzca el nombre del token, por ejemplo, "Tilda."

Copie el valor del token para utilizarlo en la importación.

Haga clic en el menú de tres puntos de la esquina superior derecha en Zero Block y seleccione "Importar" en el menú desplegable.

En Figma, seleccione la maqueta que desee en el panel Capas y copie su enlace desde la barra de direcciones del navegador.

Pegue este enlace en el campo Layout URL y añada el token de API obtenido en los ajustes de Figma en el campo API Token.

Espere a que se importe la maqueta.

Si ha introducido el enlace correcto y no hay errores en la API de Figma, el diseño se importará a Zero Block.

Nota: Por defecto, las imágenes se descargan de los servidores de Figma. Así que si quieres subirlas a Tilda, tienes que ir a la configuración de los elementos que contienen imágenes y hacer clic en Subir a Tilda.

Las maquetas deben crearse en un marco con una anchura de 1200px.

Recomendamos importar la maqueta a varios bloques en lugar de añadir toda la maqueta a uno solo.

Cualquier grupo puede importarse como imagen. Para ello, debe especificar "image" en el nombre del grupo en Figma. Si especifica "svg", se importará como un archivo SVG.

También puede importar grupos. Si hay otros grupos dentro, todos los elementos estarán en el grupo de primer nivel.

Para importar un botón, debe fusionar la forma y el texto en un grupo y nombrarlo como "botón".

La propiedad de alineación del texto también se importará, por lo que le recomendamos que haga que la anchura del elemento de texto sea la misma que la de la forma.

Si la forma tiene un efecto que no puede reproducirse en Zero Block, se importará con la imagen del efecto en el fondo.