Logo
Sometimes I write @ Pressvia

Golden Ratio Typography Calculator

Typography tool for designers & developers


As a designer I kept bumping into inconsistent type scales across projects. After learning how the Golden Ratio can help create balanced visual hierarchy, I built this calculator to speed up the process. The tool helps designers and developers create consistent type systems quickly and reliably without manual calculations.

Tech Stack:

  • Framework: Next.js
  • Design: Figma
  • Frontend: Tailwind CSS
  • Utilities: Custom scale generator + export tooling
  • Formats: px and rem support
  • Deployment: Vercel

Challenge: Designers and developers often spend time doing manual calculations to arrive at type scales. That process is slow, error-prone, and makes it harder to maintain consistent systems across projects.

Solution: Built the Golden Ratio Typography Calculator an easy-to-use interface that: visualizes type scales, exports spec sheets for design tools, and provides ready-to-copy CSS classes for developers.

The result is a small, practical tool that removes friction when creating type systems free to use and no account required.

beach hotel ui design golden-ratio-typography-calculator.jpg
beach hotel ui design golden-ratio-typography-calculator-2025.jpg