In HTML (and in typography in general, I suppose), there appears to be some defined sizes for H1-H6 -elements.
Ie., if the baseline font size is 16px (or 100%), then h1 (w/c)ould be 2.25em (36px). And H2 (w/c)ould be 1.5em (24px). Et cetera. Where do these variables come from? The H1=36px, H2=24px, H3=21px, H4=18px, H5=16px, H6=14px, that is. (or, if you like, H1=2em, H2=1.5em, H3=1.17em, etc., the point isn't the numbers themselves, but the relation between them)
Is there some mathematical formula for them? Does it have something to do with golden ratio or fibonacci? I haven't been able to find information on this.
EDIT: to be more specific, what is the pattern; why does it go from 36 to 24 to 21, or start from 36 to begin with (or, if you like, from 2em to 1.5em to 1.17em, etc.)?
Oh, I forgot to specify where I came up with the original numbers, they're from here
I know this post is old. I came across it with the same question, where do they get this from. I think I found it.
It is a derivation of a pentatonic music scale. The Type scale is anyway. The Headings are taken from the Type scale, though not in a 1:1 order.
The scale goes: 8 9 10 12 14 16 18 21 24... The scale doubles in 5 steps (12 to 24). Each step is the base(12) times 2(the scale['it doubles']) to the power of i(step) divided by 5(ttl steps)['i/5'] - rounded to the nearest.
So h4 is the base, h3 is step 1, h2 is step 3, and h1 is step 5, or the octive of 12 on a pentatonic scale. h5 and h6 are 1 and 3 steps from base the other way.If I understand this, it would be the equivalent of a, E major chord.
That took me about 2 hours to figure out with a spreadsheet and an explanation of musical scales.