Designers love to know as many tips as possible. A great tip would be to accomplish great design with the least amount of personal interpretation. Am I right?

Using the golden ratio in design allows just that: the pleasant feeling of something being just right, regardless of who’s watching.

What is the Golden Ratio

Golden Ratio is a natural ratio found everywhere. From flowers to shells, from our fingers to the galaxy, this mathematical ratio makes all forms look visually balanced and gratifying.

It’s also referred to as the Golden Section, Golden Mean, Divine Proportion, and the Greek letter Phi.

As a number, the golden ratio is approximately 1.618, and not surprisingly, it’s tied to the Fibonacci sequence.

This sequence is the sum of two numbers before it, and it starts as 0, 1,1, 2, 3, 5, 8, 13, 21, up to infinity.

The higher the Fibonacci numbers are, the more their ratio becomes closer to the golden ratio. For instance, 377 and 610. Dividing the later by the first, we get the actual golden ratio number: 1.618.

As a visual representation, these numbers can be used to create a sequence of rectangles, which also allow producing the Golden spiral.

The golden ratio in design: how to use it

When used in design, the golden ratio creates a balanced and organic composition.

Let’s imagine that you need to start your design by creating a line. Next, you copy it and divide it into two parts, getting two shapes a) the first line, and b) the second one.

Now if you take a) and divide it by b) you will see that it equals to 1.618, and it’s also equal to a) b) divided by a).

I know it can be a bit confusing at first, but once you get it, you can take advantage of this ratio, and use it for everything. From shapes, type, logos, layout, you name it.

Typography, and layouts

If you’re anything like me, you’re always a bit unsure on how to balance type. But guess what? The answer is also in the Golden Ratio.

Start with one size of copy that feels right to you. Let’s say you have a body with a 10px size. Multiply that number by 1.618, and you’ll have the perfect balanced header text size (in this case would be 16px).

The opposite is also applicable. You can start by the header size and divide it by the golden ratio number to obtain the body copy size.

As for layouts, consider using rectangles or circles that respect the golden ratio proportion. I can guarantee that it will help you to hierarchize the information as well as to make it more balanced.

Icons, shapes, and logos

Like we’ve seen before with lines, you can use this rule to construct different shapes. It will help with icons and logos when you want them to feel more geometric, and even.

National Geographic, Toyota, and Pepsi follow the Golden ratio proportion. So it’s time you experiment with it as well!

5 Tools to use the Golden ratio in design

Now you already know what is it for and how to use it. But you cringe at the time that it will take you to do all the calculations. You want to do it quickly and easily instead.

I know you would probably think that, so I did some research to help you out.

1. Golden Ratio Calculator

This calculator does the math for you. You insert one of the values: the shorter, longer or the full length of the line, and let it do the rest of the calculations for you.

2. Golden Ratio Generator for Images

When you want to crop an image but still make it balanced, you can use the golden ration. Luckily, this image generator will help you ensure that you keep the right proportions.

3. Vector Template for Illustrator

It’s not an online tool, but it will be very useful when designing in Illustrator. Instead of constructing your golden ratio template, consider using this one first.

4. Typography Calculator

You already know how to have the right proportion between fonts. However, in some cases, you also need to adjust it to the content width (especially in web design).

This calculator will allow you to choose your font and width to get the best results.

5. Golden Rectangle calculator

If you plan on building a layout and you need to use rectangles, this tool is going to save a lot of time.

Input the size of the bigger shape and let it do the rest of the calculations for you.

Make your design process simpler

Now you have all the knowledge and tools to take advantage of this ratio, and there’s no reason why you shouldn’t try it.

Create some awesome design and let me know how it turned out.