Alignment Options in Image Fills

Forum|Forum|5 years ago
April 22, 2021
58 replies
6097 views

As I was looking for a way to do this natively in Figma, I came across this concept article on Medium. In the article, Андрей Насонов (Andrey Nasonov) describes adding the option to choose alignment in the image settings beyond the default centered. This would be a simple but huge improvement to image settings, especially for responsive design.

Here’s his example of how that might look on the Properties Panel for images:

If anyone has found any way to work around this other than individually cropping images for different container widths, pls hmu! 🙏

Share an idea

Show previous replies

Jason_Williams

New Participant

+1 here as well. In our design system we have header components that should be able to take any image but not being able to align the image within a FIT makes our designs difficult to show what we intend. Given that this is a very basic feature of CSS and how often that it is used I hope we can get this added to our image options. Also, since images can be background fills in auto layout it would be nice if it worked for any image fill.

Rafastesia

Let’s revive this thing, because is mindblowing this is still not possible with Figma.

M

Marc2

a shame that this is not yet possible …

James_Walsh

New Participant

Throwing another voice in the ring. Trying to fully embrace auto-layout to create responsive designs directly in Figma, and simple blockers like this keep popping up.

AntonioGuedes

+1000 here! This is a must have feature. When creating mock ups that need perfect crop fitting, it would be great to align top or bottom.

A workaround: if you set it to crop, use Shift + arrows to position your image using the snap to grid function.

T

thrddmntn7

I need this to add a background image fill to our Design Language System. All of our pages use a responsive image background and this needs to be reflected in our designs. This functionality has been around in html since the beginning of time. Seems like table stakes for a web design tool.