: Aesthetic rules for sizing items in grid cells (TL;DR: How big should the black boxes be in the grid below?) I have a grid of cells containing a rectangular shaped image (it's actually the

@Correia448

To my eye, the columns between image are so wide that I perceive the images as three columns. If this is your intention, then the spacing is appropriate.

If grouping by column is not your intention, then I would tighten the images a little bit. I also perceive the difference in the top and side margins of the enclosing green square to be too big.

Below I show how I would do it, in absence of any other requirements.



The role of the green background is also important. Is it a mask for a frame? is it a background on a web page which is smaller than the screen? Is it the screen itself?

For example, if there was content around the green background and space was an issue, I would make the margins as small as possible while still retaining visual separation between the black rectangles and the surrounding copy.

Vote Up Vote Down

@Caterina889

Images sink.

It is customary to alter vertical spacing to allow slightly more space at the bottom of images. Visually images tend to sink a bit when "matted" or surrounded by a field of color.

I'd use

1 x left and right
1 x top
1.5 x bottom

Vote Up Vote Down

@Cooney243

I would make the spacing around each image, 33% larger than the image.
However, context is important. Scaling up/down, etc etc.

Vote Up Vote Down