Una guía rápida de los ajustes de relleno de imagen de Figma

() translation by (you can also view the original English article)

En este tutorial, aprenderás todos sobre los ajustes de relleno de imagen de Figma. Existen 4 en total, cada uno de los cuales te permite manipular la imagen de relleno de un objeto de formas diferentes. Habiendo dicho esto, ¡echemos un vistazo!

Ajustes de imagen de relleno en Figma

Esta es una versión completa en video de este práctico tutorial. Síguenos en nuestro canal Envato Tuts+ de YouTube:

Comienza con un relleno

Comenzaré creando un objeto en el artboard, luego iré a la opción Relleno (Fills), en el panel de propiedades a la derecha, y seleccionaré relleno de Imagen (Image) como en el ejemplo.

Luego, podrás subir una imagen de tu elección y tendrás 4 opciones de tipo de relleno, como:

1. Relleno (Fill)

Relleno (Fill) estará seleccionado de forma predeterminada. Esto garantiza que la imagen va a rellenar todo el objeto. Si el objeto es más ancho o alto que la imagen, esta se estirará o recortará según el objeto, pero siempre permanecerá centrada y dejará visible la mayor parte posible:

2. Ajustar (Fit)

Si cambiáramos el tipo de relleno a Ajustar (Fit) en este punto, podremos ver la imagen en el objeto contenedor, incluso si esto significa que parte del objeto no tendrá relleno.

3. Recortar (Crop)

El tipo relleno Recortar (Crop) se comporta de manera similar a Fill (relleno por defecto), con la diferencia de que te ofrece herramientas de posicionamiento para personalizar el recorte por ti mismo. Como se ve en el ejemplo de abajo, podrás escalar y mover el objeto sobre la imagen como si fuera una ventana:

Otra diferencia es que cuando redimensionas un objeto después de aplicar el tipo de relleno Recortar (Crop), la imagen se escalará junto con el objeto en ambos ejes (encogiendo y estirando la imagen de forma efectiva).

4. Mosaico (Tile)

Es último tipo de relleno es Mosaico (Tile), el cual repite la imagen una y otra vez. Esto se demuestra mejor en la imagen de abajo, donde podemos ver una imagen con un mosaico que se repite:

Tal y como puedes ver la imagen se repite infinitamente a medida que el objeto cambia de tamaño. En las opciones también podrás determinar la escala de la sección repetida.

Estos fueron todos los ajustes de relleno de Figma

¡Hoy descubriste las diferentes formas en las que puedes rellenar un objeto en Figma! Espero que hayas disfrutado esta guía práctica. No te olvides de echarle un vistazo a los recursos adicionales de Figma que aparecen a continuación.