Learning Design

Letter Spacing §

On bigger headings, the latter spacing can be reduced below the default and this generally leads to be better “feel good”. This is what Apple and Vercel do with their h1s.

Vercel used to use the Inter font. Inter is interesting as its website has a page where you can change the font-size and it shows you what the letter spacing should be. e.g.

• font-size 16 recommends -1.1%
• font-size 30 recommends +2%

Vercel now uses Geist, their own font.

Inter was designed by Rasmus Andersson. His site has a bunch of interesting design resources.

(Element) Spacing §

From The Secret Science of Perfect Spacing by Chainlift, theres 3 rules:

1. Every element is related to every other element. Yes, every element. Simply by the fact of being part of the same viewport.
2. Some relationships are stronger than others. Not all elements are related as strongly as others. This is called Hierarchy.
3. The stronger the relation, the closer the elements. If elements are more closely related, they should be physically together.