Φ Design using the Divine Proportion Φ

“Mathematics is the language in which God has written the universe.”

— Galileo Galilei

The divine proportion, aka the golden ratio, the golden number, the golden section, the golden cut, or phi (Φ) is a mathematical ratio that describes the perfectly symmetrical relationship between two proportions. In algebraic form, the equation that represents this special ratio is (1+√5) / 2.

The result is 1.618, aka phi.

Mathematics, design, and art are all closely related. It was Thomas Aquinas who called God “the Grand Designer” and no matter which higher power you believe in, or none at all, you must respect the frequency with which the divine proportion can be observed throughout all reality.

Unfortunately, it seems many designers have no idea how to use this concept to better their designs, or even that it exists — let’s change that.

The divine proportion is everywhere.

Phi manifests itself all throughout the natural world, from the human body and facial structure to seashells, flower petals, tree leaves, ocean waves, and even the cloud formations of hurricanes.

It is for this reason that many artists of the past believed phi to be the ultimate distillation of beauty — it’s even been suggested that the most aesthetically pleasing human faces are the ones that have grown to reflect the proportions of phi the most accurately.

If Φ is a building block of nature itself, why not use it to improve your designs?

Applying the golden ratio to typography.

This is perhaps the most straightforward application for designers.

When setting the size of your type, memorize this number (1.618) and use multiples of it to decide what pt value to use. In other words, if your body text is 37 pt, you can multiply by 1.618 and get 59.86, and round up to 60, easily achieving balance and harmony between text of various sizes.

Use phi to inform your composition.

Designers have many factors to consider when creating a layout, but if you want visuals that are balanced and easy to comprehend, consider using the divine proportion as a guide.

For example, if you’re building a web page and the main section has a width of 1000 px, you could divide by 1.618 to get a value of about 618px. 618 divided by 1.618 is about 382, so you could have a large column 618px wide with a sidebar 382px wide — appearing perfectly balanced and harmonious.

This post was created with Typeshare