Literature on The Rule of Thirds

Here’s the entire UX literature on The Rule of Thirds by the Interaction Design Foundation, collated in one place:

Rule of Thirds: The Definitive Guide & Examples

Picture this: You want to design a stunning graphic or capture a momentous photograph. You want to ensure that your visuals resonate deeply with your viewers, leaving a lasting impression.

Many design techniques and photography rules can help you achieve the results you desire. One such principle that has stood the test of time is the renowned 'Rule of Thirds’. Strategically placing key components at intersecting points or lines can create a dynamic balance within your designs. This adds a fresh sense of harmony and symmetry to your compositions.

From a captivating portrait to the perfectly balanced design elements in a graphic or even the harmonious layout of a website—the Rule of Thirds empowers you to create visuals that are not only aesthetically pleasing but also emotionally compelling.

In this article, you will learn the importance of the rule of thirds in photography and design. Right from the definition to rule of thirds examples to the correct tools—this guide covers everything you need to know!

What Is the Rule of Thirds?

The rule of thirds is a composition technique that guides you to place your subject on the left or right, leaving more room for the other objects. Although there are other forms of composition, the rule of thirds helps get the most well-composed shots.

Imagine dividing your image into nine equal parts with the help of two vertical and two horizontal lines. That’s precisely what makes the rule of thirds. Using this grid, you must place your objects along the lines or at the points where they intersect.

The best part? This setting is readily available on most cameras and mobile phones.

The rule of thirds is one of the most helpful tools that empower you to balance your main subject and the white space within your image. If you’re starting to embark on your journey to become a photographer, this technique can take your pictures from mediocre to mesmerizing.

However, there is only one way to master this technique: practice. With dedicated and consistent application, the rule of thirds transcends a mere skill and becomes a spontaneous habit.

“If you are tuned in to the imagery we see around us, I feel like you sort of absorb [the rule of thirds] even if you can’t put your finger on it.”

— Khara Plicanic, Photographer, Author, and Instructor.

What Is the Rule of Thirds In Graphic Design?

The rule of thirds in graphic design is like dividing a page into tic-tac-toe (naughts and crosses) board. Imagine that your canvas is divided into nine equal parts with two horizontal lines and two vertical lines. Take the below image as an example; these lines help align and position graphic elements like the apple, and arrange your design so that it is easier for people to perceive.

When you use the rule of thirds, the lines cross at four points in the middle of the page. These are the "sweet spots" in your design, where people naturally tend to look first. Putting your main subjects (such as elements, text, images, or icons) here can make your work more interesting and dynamic.

The rule of thirds is a handy design tool that creates balance and adds interest to your work. It helps you highlight important parts of your layout and guides viewers' attention. By using this rule, you can make designs that are more visually striking.

What Is the Rule of Thirds in UI Design?

Like in graphic design, the rule of thirds in UI (User Interface) design is a fundamental principle that helps structure and organize elements on a screen. It involves dividing the screen into a 3x3 grid, which results in nine equal parts.

Usually, the four intersections are ideal for placing crucial elements. For example, look at the website template from Wix given below. This Wix website template places important elements like the hero Image, titles or CTAs (calls to action) along the horizontal grid lines. A note of caution, though. Due to the responsive nature of UIs, such placement will work best on only some screen sizes.

In UI design, the main purpose of this rule is to make designs look interesting and effective.

How to Use the Rule of Thirds in Photography

Using the rule of thirds is easier once you understand it correctly. Also, practicing it will help you capture better outcomes. To use it properly, you must keep four essential guidelines in mind.

Follow these tactics to improve the aesthetic of your photos.

1. Align the Subject With Lines or Intersections

When you’re about to take a photograph, you can enable a 3x3 grid on your digital camera screen and add it as an overlay. Focus on the four intersections the grid lines form and align your subject with one of these. You can also align it with the vertical or horizontal lines. Take the image below as an example. The human figure is the subject or the focal point, placed along the right line. This way, the focus remains on the subject, but the other visual elements complement it and set the scene.

2. Align the Linear Elements With Grid Lines

You can also align your elements with either the vertical or horizontal axis. Another common program that includes a mobile application is Lightroom. The orientation of your objects and the scene will decide which line you can use here. For instance, objects in a landscape (e.g., horizons, trees/forests, beaches, and cityscapes) work best aligned with horizontal grid lines.

Conversely, elements like doors, pillars, waterfalls, and people in standing positions look better when you align them with the vertical grid lines. This makes your photo more aesthetically pleasing to the eye. At the same time, you can emphasize the scene's interesting elements more.

Instead of placing the horizon line at the center, align it with one of the grid lines. Aligning it with the lower grid line, such as in this image brings more focus to the sky.

3. Align Objects Diagonally

Another advanced tactic is to align elements diagonally. This tactic is effective when you want to capture objects with irregular shapes; for example, paths, roads, and rivers. Instead of placing the central element in a left-to-right direction, you can position it diagonally. To ensure they’re aligned right, check for the diagonal intersection points. This helps the viewer's eyes wander around the image.

Consider aligning subjects diagonally, instead of horizontally or vertically. For example, this winding river makes for a more dynamic composition when it diagonally splits the image.

4. Break the Rule of Thirds

Although it is rare, you can completely disregard the rule in a few cases. For instance, if you see a balance in the scene, there is no need for the rule of thirds. Like in the picture below, you may find symmetry in landscapes with lake and river reflections, seas, and wet roads.

In this image, the buildings, along with their reflection, form one unit, thus making the rule of thirds tricky to implement. That said, even with the image split neatly into two, where does your eye focus on? Chances are, along one of the intersection points.

There are various other scenarios in photography where using the rule of thirds may be challenging. Let’s take a look at those:

1. Small Subject

If you want to click a picture where the subject is too small, the rule of thirds breaks here. If you want to highlight the subject, keep the rule of thirds aside and place it at the center of the image.

2. Frame-Filling Portraits

When you want to click a picture where all parts of an image aren't entirely in the frame or when the subject is in the foreground, applying the rule of thirds gets complicated. How? If the subject occupies most of the frame, there’s only one thing to focus on. Hence, there is no need to apply the rule of thirds.

Rule of Thirds Examples

Now that you know how to use the rule correctly, let’s look at a few rule of thirds photography examples. These will help you better understand how the composition in a photograph works.

Example 1

A tree aligned along the left vertical grid line with the horizon aligned along the lower horizontal grid line.

This photo is a perfect example of using the rule of thirds for good composition. Here’s what you can take away from this picture:

The tree, which is the main subject, is perfectly aligned with the left vertical line and well positioned with the help of the intersections. This leaves negative space on the right to set the scene.
The photo is cleanly divided into two parts. With the ground aligned to the horizontal grid line, ⅓ of the picture is the foreground. ⅔ of the photograph makes the background, adding depth.
Since no object or element is on the right, there are no distractions, and the focus remains on the subject.

Example 2

This example looks similar to the previous one, but only partially. Here’s the key takeaway from this example:

The horizon in this image is not complete, or you can say that there isn’t one.
The rule of thirds is loosely followed in this picture, positioning only the subject (the windmill) on the left with the aid of intersections.
The photographer has tried to align the limited horizon with the bottom horizontal gridline to maintain balance and proportions.

Example 3

Here, the photographer has used the rule of thirds loosely, almost breaking it. But there sure is a lot to learn from this type of composition.

The photographer has divided the image into two almost equal halves horizontally by positioning the coastline at the center.
The photo's main subject is the boat nearly at the center. Since it is smaller, it leaves room for the essential details.
The image is divided into three parts: the river (the foreground), the horizon, the subject (the central element of the picture), the trees and the sun (the background).

Example 4

This example is not something you usually come across. It is rare to find such symmetry in objects or landscapes. Here’s what you can learn from this example:

Clearly, the subject (the facade of the mosque) covers most of the frame. But what’s great about this picture is its nearly perfect alignment with the grid. If you look closely, the positioning is so balanced that the spacing around the subject is almost equal on both sides.
The center alignment of the subject leaves room for additional details, like the sky and design on the floor.
This photograph is also divided into three parts: the designer floor (the foreground), the subject (the facade of the mosque), and the sky (the background).

Example 5

This image's alignment and compositional elements teach more than just the rule of thirds.

The photograph is divided into three unequal parts: the waterfall (the main subject), the pool (foreground), and the sky (background).
The waterfall is well aligned with the vertical grid line on the left and flows into the frame towards the bottom right. This helps draw the viewer's attention to one part at a time. You can also consider there to be a leading line that enables you to pan your eyes from left to right.
The alignment of the waterfall on the left also emphasizes the wall and additional details, making it look more aesthetic.

Example 6

Using the rule of thirds in portrait photography is comparatively more accessible than in landscape photography. Take the above image as an example:

If you want to keep your subject in the center and focus, placing the eyes on the upper horizontal grid line is the best way to get the right alignment.
The additional parts, like shoulders, must stay within the lower grid line.
Ensure the face is at the center.

Learn more about grid systems in How To Use Grid Systems

Best Tools for Editing Using the Rule of Thirds

If you can’t use the rule of thirds correctly while clicking pictures, you can improve the composition while editing your photos. Every piece of editing software has the option to use grids, and here’s how you can use it in different software:

1. Adobe Photoshop

There are two ways to apply the rule of thirds in Adobe Photoshop:

Way 1

Open Photoshop and place the photo you want to edit.
Next, on the top toolbar, click on the icon next to the home and select any one of the crop options.
Look for the little grid icon in the top bar and select the first option, Rule of Thirds.
Next, check the box for Always Show Overlay in the same menu.

Way 2

Go to Edit > Preferences > Guides, Grids & Slices, then navigate to the submenu.
Set Gridline Every to 100 > Click on the navigation next to it, select Percent > Set the subdivisions as 3 and click OK.
If you still can’t see the gridlines, go to view and enable the extras.

Screenshot of Adobe Photoshop's Guides, Grid & Slices section of Preferences.

2. Lightroom

Another popular software that also has a mobile app is Lightroom. It is one of the most preferred pieces of photo editing software. To use the rule of thirds grid in Lightroom, follow these steps:

Import your photo into Lightroom.
Go to the Develop module > click on Crop Overlay option.
Go to Tool > Crop Guide Overlay > Thirds to enable the three-by-three grid in Lightroom.

3. GIMP

To use the rule of thirds while editing in GIMP, follow these steps:

To enable the grid in GIMP, choose View, then Show Grid.
The default grid appears on the screen as a series of solid lines, each set 10 pixels apart.
You can change the appearance and spacing of the grid lines. To do that, choose Image < Configure Grid. You can divide the width and height of the image by 3 to obtain the correct values to enter in the dialog box.
Next, choose a line style of your liking, color, and spacing to customize.

4. Canva

Although Canva is a popular cloud software for graphic designing, many people also use it for photo editing. Therefore, using the rule of thirds grid in Canva is simple. But this feature is only available in a pro account. If you have a Canva Pro account, here’s how you can enable it in Canva:

Create a custom-sized art board according to the image you want to edit.
Add your photo to the uploads and place it on the artboard.
Next, select 'Files' in the top-left corner and select ‘View Settings.’
In ‘View Settings,’ select ‘Add guides.’
Once selected, you can customize the number of rows and columns you want on your artboard.
Go to ‘Custom,’ add the number of rows and columns (3X3), and you’ll have the rule of thirds grid on your artboard.

Take Your Graphics to the Next Level!

Now that you’ve seen the rule of thirds photo examples, we’re optimistic that you have a fair idea of how the rule of thirds works in photography. It's also fine to break the rule but to do that, you must ‘know’ it. All you need to do is practice, and you’ll soon know when to follow or go against the rule!

Additionally, you can take courses on visual perception by the IxDF to understand the anatomy of the eye, theories of human color vision, and other essential principles. This will add to your skills and help you capture better photographs.

Learn more about The Rule of Thirds

Take a deep dive into Rule of Thirds with our course Visual Design: The Ultimate Guide .

In this course, you will gain a holistic understanding of visual design and increase your knowledge of visual principles, color theory, typography, grid systems and history. You’ll also learn why visual design is so important, how history influences the present, and practical applications to improve your own work. These insights will help you to achieve the best possible user experience.

In the first lesson, you’ll learn the difference between visual design elements and visual design principles. You’ll also learn how to effectively use visual design elements and principles by deconstructing several well-known designs.

In the second lesson, you’ll learn about the science and importance of color. You’ll gain a better understanding of color modes, color schemes and color systems. You’ll also learn how to confidently use color by understanding its cultural symbolism and context of use.

In the third lesson, you’ll learn best practices for designing with type and how to effectively use type for communication. We’ll provide you with a basic understanding of the anatomy of type, type classifications, type styles and typographic terms. You’ll also learn practical tips for selecting a typeface, when to mix typefaces and how to talk type with fellow designers.

In the final lesson, you’ll learn about grid systems and their importance in providing structure within design. You’ll also learn about the types of grid systems and how to effectively use grids to improve your work.

You’ll be taught by some of the world’s leading experts. The experts we’ve handpicked for you are the Vignelli Distinguished Professor of Design Emeritus at RIT R. Roger Remington, author of “American Modernism: Graphic Design, 1920 to 1960”; Co-founder of The Book Doctors Arielle Eckstut and leading color consultant Joann Eckstut, co-authors of “What Is Color?” and “The Secret Language of Color”; Award-winning designer and educator Mia Cinelli, TEDx speaker of “The Power of Typography”; Betty Cooke and William O. Steinmetz Design Chair at MICA Ellen Lupton, author of “Thinking with Type”; Chair of the Graphic + Interactive communication department at the Ringling School of Art and Design Kimberly Elam, author of "Grid Systems: Principles of Organizing Type.”

Throughout the course, we’ll supply you with lots of templates and step-by-step guides so you can go right out and use what you learn in your everyday practice.

In the “Build Your Portfolio Project: Redesign,” you’ll find a series of fun exercises that build upon one another and cover the visual design topics discussed. If you want to complete these optional exercises, you will get hands-on experience with the methods you learn and in the process you’ll create a case study for your portfolio which you can show your future employer or freelance customers.

You can also learn with your fellow course-takers and use the discussion forums to get feedback and inspire other people who are learning alongside you. You and your fellow course-takers have a huge knowledge and experience base between you, so we think you should take advantage of it whenever possible.

You earn a verifiable and industry-trusted Course Certificate once you’ve completed the course. You can highlight it on your resume, your LinkedIn profile or your website.

All open-source articles on The Rule of Thirds