Get AI summaries of any video or article — Sign up free
The Golden Ratio: Design Stunning Illustrations in your PKM with Excalidraw and Obsidian thumbnail

The Golden Ratio: Design Stunning Illustrations in your PKM with Excalidraw and Obsidian

5 min read

Based on Zsolt's Visual Personal Knowledge Management's video on YouTube. If you like this content, support the original creators by watching, liking and subscribing to their content.

TL;DR

The golden ratio φ is approximately 1.618 and is linked to Fibonacci because ratios of consecutive Fibonacci terms converge on that value.

Briefing

The golden ratio—often labeled φ (phi), the Fibonacci ratio, or the golden mean—is presented as a design and composition rule that keeps showing up in nature, the human body, and classic art. It’s tied to the Fibonacci sequence: as the ratios of consecutive Fibonacci numbers grow, they converge on approximately 1.618, the value associated with the golden ratio. That convergence matters because it gives designers a repeatable mathematical scaffold for proportion—one that can be translated into grids, spirals, and even typography.

The transcript walks through how the Fibonacci sequence is built (each term is the sum of the previous two: 1, 1, 2, 3, 5, 8, …). Taking ratios of successive terms (for example, 2/1, 3/2, 5/3, 8/5) approaches 1.618. From there, the golden spiral and golden rectangle are described as geometric manifestations of those proportions, with the Fibonacci sequence appearing in the way a layout is subdivided into successively scaled rectangles. The golden ratio is then linked to visual patterns people recognize in everyday life—flowers, shells, and wave-like forms—as well as to human anatomy, including facial and bodily proportions.

Ancient and cultural references are used to reinforce the idea that the ratio has long served as a practical design tool. Greek architecture is cited, along with the Taj Mahal, and the claim extends to major artworks where the golden spiral or golden grid can be “discovered.” The transcript also notes that the ratio appears in unexpected domains, including politics and even cats and sleep—suggesting that proportional harmony is widely observed, not confined to formal art.

The practical payoff comes next: the golden ratio can improve composition in concrete ways. For image cropping, applying a golden spiral or golden grid is described as a method for choosing a more visually satisfying cut than arbitrary cropping. For illustration and thumbnails, placing the spiral/grid guides where key elements land; the transcript also adds that font sizing can follow Fibonacci steps, helping text feel balanced rather than randomly scaled. Several examples are used to make the point: an iconic poster is said to align perfectly when overlaid with a golden grid, and a website layout is described as naturally organized when mapped to the same proportional structure.

Finally, the transcript shifts from theory to workflow by introducing an “Excalidraw and Obsidian” script named “golden ratio.” After installing or updating the script, users can generate different golden grids (center-out or left-to-right, with a chosen number of grid lines), insert spirals (including double spirals with adjustable boldness), and automatically scale text. The text-scaling feature cycles through multiple Fibonacci-based sizes—producing two larger steps and two smaller steps relative to the original—so users can iterate on hierarchy. The closing recommendation frames this as a PKM (personal knowledge management) advantage: better illustrations and typography support clearer notes, and the golden grid is positioned as a foundational tool for that improvement.

Cornell Notes

The golden ratio (φ ≈ 1.618) is tied to the Fibonacci sequence: as ratios of consecutive Fibonacci numbers increase, they converge on 1.618. That mathematical relationship produces practical geometry—golden grids and golden spirals—that can guide composition, cropping, and element placement. The transcript argues that proportional harmony appears across nature, human anatomy, and classic architecture/art, making it a useful design rule rather than a purely academic curiosity. A script for Excalidraw is introduced to generate golden grids/spirals and to scale text using Fibonacci-based steps, including a cycling workflow for quickly testing typographic hierarchy. The takeaway is that applying φ can make illustrations and knowledge-work layouts feel more balanced and intentional.

How does the Fibonacci sequence connect to the golden ratio value 1.618?

The Fibonacci sequence is built by adding the previous two terms (1, 1, 2, 3, 5, 8, …). If you take ratios of consecutive terms—like 2/1, 3/2, 5/3, 8/5—those ratios steadily approach a limit. That limit is approximately 1.618, commonly written as φ (phi), which is why Fibonacci and the golden ratio are treated as linked.

What geometric tools does φ produce for design work?

The transcript describes the golden rectangle and golden spiral as geometric manifestations of Fibonacci-based proportions. In practice, these show up as overlays: a golden grid (subdividing a layout into proportionally scaled regions) and a golden spiral (a curved guide for where elements “fit” as the layout expands). These overlays can be placed on top of images, posters, thumbnails, and website layouts to guide placement and scaling.

What are the concrete use cases for golden grids/spirals mentioned in the transcript?

Several: (1) Image cropping—using the golden spiral/grid to choose a cut that looks more naturally balanced than an arbitrary crop. (2) Illustration and thumbnails—placing the spiral/grid so key items land in visually appropriate positions; the transcript also notes that font size can follow Fibonacci steps. (3) Website design—aligning buttons, sidebars, and other UI elements within the golden grid. (4) Font scaling—using Fibonacci-based size steps so headings and subheadings stand out in a consistent hierarchy.

How does the Excalidraw “golden ratio” script help users apply these ideas quickly?

After installing/updating the script (by searching for “golden ratio”), users can run it on a drawing to generate overlays and automate sizing. Options include creating golden grids centered out in both directions (with a chosen number of grid lines), creating left-to-right grids with fewer lines, inserting spirals (including double spirals with adjustable boldness), and resizing text. For text, the script cycles through multiple Fibonacci-based sizes: it produces two larger versions and two smaller versions relative to the original, and users can trigger the next step after a short wait.

Why does the transcript frame golden-ratio design as relevant to PKM?

The argument is that personal knowledge management depends on clear, high-quality illustrations and layouts. Since the golden grid is positioned as a fundamental tool for good design, using it in Excalidraw (and by extension in PKM workflows tied to Obsidian) is presented as a way to make notes and visual knowledge artifacts more readable and better structured.

Review Questions

  1. What mathematical process leads consecutive Fibonacci ratios to converge on φ ≈ 1.618?
  2. Give two different ways the golden grid/spiral can be applied to improve a layout (e.g., cropping vs. typography).
  3. How does the “golden ratio” script change text sizing, and what does the cycling behavior allow a user to do?

Key Points

  1. 1

    The golden ratio φ is approximately 1.618 and is linked to Fibonacci because ratios of consecutive Fibonacci terms converge on that value.

  2. 2

    Golden grids and golden spirals translate Fibonacci proportions into practical layout overlays for placement and scaling.

  3. 3

    Golden-ratio composition is presented as a recurring pattern in nature, human proportions, and classic architecture/art.

  4. 4

    Applying φ can improve cropping choices by guiding where a subject “fits” within a balanced frame.

  5. 5

    Golden-ratio overlays can structure thumbnails, illustrations, and website layouts by aligning key elements to the grid/spiral.

  6. 6

    Typography can follow Fibonacci-based scaling so heading hierarchy feels proportionally consistent rather than arbitrary.

  7. 7

    An Excalidraw “golden ratio” script automates grid/spiral overlays and Fibonacci-based text resizing with a step-by-step cycle.

Highlights

Fibonacci ratios of consecutive terms steadily approach φ ≈ 1.618, turning an abstract sequence into a usable design constant.
Golden grids and golden spirals act as overlays that can guide cropping, element placement, and overall composition.
The “golden ratio” script can generate center-out grids, left-to-right grids, single/double spirals, and Fibonacci-based text size cycles in Excalidraw.
Text resizing is handled as a sequence: two larger steps and two smaller steps relative to the original, letting users quickly test hierarchy.

Topics

Mentioned