How to Apply the Rule of Thirds?

So in a previous post, I explained what the rule of thirds was. If you guys haven’t already checked it out, you can find that post here at

Now that you have your rule of thirds grid built, let me show you what you can use it for.

Think of the grid as a sort of map. The intersections indicate the areas of prime interest that the viewer’s eye will be naturally drawn to within your design. By bringing an element closer or farther to one of these intersections, you can make that element stand out more, or take it out of focus respectively.

The rule of thirds helps take the guesswork out of composition, as long as you use the central intersections as guideposts for your content. So long as the main element of focus aligns closely with at least one of the 4 central intersections or guiding lines, the viewer’s eyes will naturally and effortlessly land on the subject without having to visually scan around.

Tadrart01.JPG: Pir6monderivative work: Teeks99, CC BY-SA 3.0 <https://creativecommons.org/licenses/by-sa/3.0>, via Wikimedia Commons

For example, in the case of web design, you can employ the rule of thirds by placing a call-to-action button or other key element in one of these sweet spots, since you know the eye will naturally fall upon the four intersection points.

Because the rule of thirds draws a grid that evenly divides your canvas, you might get the inclination to evenly distribute your elements to give it a perfectly symmetrical appearance. However, that would be a trap. While it may be true that humans are naturally drawn to symmetry, a symmetrical design is less engaging and less dynamic and thus more likely to be overlooked. Asymmetry sends a trigger to our brains that something is different, and more will consistently draw our attention.

This does not mean that you can throw balance right out the window however. To fully take advantage of the rule of thirds, you have to achieve a composition that is both asymmetrical while maintaining good balance.

“Asymmetry” and “balance” are not opposing concepts. When you think about a perfectly symmetrical photograph, the sense of balance is clearly strong . However, this kind of photograph can sacrifice a sense of movement and flow. Symmetry implies stasis, rigidity, and even confrontation. For example, a symmetrical photo of a figure will typically appear to “stare you down” and stand firmly in place. Moving the subject towards one side or the other however will invite a flow of motion. This asymmetry will give you the chance to experiment by adding elements on the opposite side of the page to provide a pleasing counterbalance. Thus, asymmetry is achieved while maintaining balance.

Thanks to the grid made by the rule of thirds, you know which areas that have the most weight. If there is an important element on the bottom left intersection, you don’t want another element on the top left intersection overshadowing it. On the other hand, opposing intersections, such as the bottom left and top right can be equally matched, so by focusing elements in these areas, you can easily achieve balance in your composition.

Though symmetry is not always necessary for good design, balance is absolutely key. The grid provided by the rule of thirds is one of the best tools to guide you to using asymmetrical balance to your advantage. If your design is not balanced, the entire look will look off. Using a rule of thirds grid helps you maintain good balance while still keeping things asymmetrical.

Want More? Try out Coolab!
Do you want to create stunning 3D designs? Try out Coolab! You don’t need any special equipment or tech-savvy knowledge.

Coolab.ai is a design tool that comes with hundreds of custom designer templates. With an easy-to-use user interface, no design skills are required. Best of all, it’s totally free!

Get designing now