line height calculation feels wonky

[marcospgp]

it seems the way line height is calculated for different font sizes does not make much sense

it starts small and increases towards the base font size, but then as the font size increases it starts getting smaller again

--text-xs--line-height:       calc(1 / 0.75)     = 1.333…
--text-sm--line-height:       calc(1.25 / 0.875) = 1.428571…
--text-base--line-height:     calc(1.5 / 1)      = 1.5
--text-lg--line-height:       calc(1.75 / 1.125) = 1.555…
--text-xl--line-height:       calc(1.75 / 1.25)  = 1.4
--text-2xl--line-height:      calc(2 / 1.5)      = 1.333…
--text-3xl--line-height:      calc(2.25 / 1.875) = 1.2
--text-4xl--line-height:      calc(2.5 / 2.25)   = 1.111…
--text-5xl--line-height:      1
--text-6xl--line-height:      1
--text-7xl--line-height:      1
--text-8xl--line-height:      1
--text-9xl--line-height:      1

[RobinMalfait]

It might look a little bit strange, but if you look at actual examples it makes sense to me: https://play.tailwindcss.com/uvSQoGF7MD

You don't want to have huge line heights when your text is gigantic already, and you also don't want to have touching text (because of small line heights) when the font size is tiny.

[marcospgp]

I would highlight in particular how line height goes down as the font size goes down, which should be the reverse for readability!

[marcospgp]

@RobinMalfait line height goes down as font size goes down