8 Factors that Affect Compositional Balance

8 Factors that Affect Compositional Balance
in: Design , in: The Basics

When designing a website or laying out the foundation for any kind of artwork, a key principle that is sometimes overlooked is Compositional Balance. Every element in a composition has a relationship with the other items on the page and it is the designer’s task and challenge to assign these items appropriate roles to communicate the message that the client wants to be conveyed.


Size is probably the most obvious factor of all. Simply put, larger items on a page will have more visual weight than smaller items.


Warm colors move forward and usually weigh more than cooler colors, whereas cool colors typically recede into the background. Red is known to be one of the heaviest colors whereas yellow is considered to be one of the lightest or least heavy.


Dark objects are heavier, or hold more visual weight than light elements.


The location of items also plays part in visual weight and hierarchy. Items that are positioned higher in a project are thought to weigh more than items that are positioned further down in the composition. The further in the front or foreground that the items are positioned, the heavier the visual element will weigh. Elements in the background obviously will weigh less.


If you are looking at two floor tiles where one is smooth and the other textured, no matter which you prefer the most, the textured one will catch your eye first because textured elements appear heavier to the eye than non-textured ones. Texture plays a role in an item looking 3-D, which typically gives the object the look or appearance of mass or physical weight.


The more items that are stuffed into a given space, the more visual weight it will carry. If you are looking at a shelf packed with items, it will look much heavier than an empty shelf.

White space.

White space seems to have the lightest weight or even no weight at all. It is seen as empty. If an object is placed within a large field of white space, it will seem heavier because of the mass amount of empty space around it.


Very saturated colors seem heavier than desaturated colors. Imagine a field of gray squares with bright pink and blue ones scattered randomly amongst the grey. The saturated squares will stand out more, thus giving them a heavier visual weight.

Defining Visual Balance

Visual balance is the result of visual weight and visual direction and how they interact with one another. Look at the image below that depicts a small object and a large object being balanced on a scale and try to see which of the 8 factors above play a role in the compositional balance of the image.

Immediately, you will see that the larger object carries much more visual weight than the smaller one—and you may note that the larger object being a deep red color makes it look even heavier when compared to the small yellow object.

The image creates visual tension because multiple factors (size, color, value, position) are telling you that gravity should pull the red object downward on the scale. The objects are out of balance based on the relative weights of the blocks and the direction of the forces being applied to them.

These are certainly not the only factors involved in compositional balance, but they are a good place to start. When designing or creating artwork, keeping these ideas in mind will help bring your message forward and make your project more visually appealing to your audience.

Facebook icon
Twitter icon
LinkedIn icon
Pinterest icon