xFonts
This section deals with typography:
​
production heading and paragraph styles (black)
​
font scaling
​
​
Atkinson Hyperlegible is used for body text.
HelveticaBold and bolded Helvetica are used for titles.
An extended Helvetica family is used for Calendar Event app.
Font Awesome is used for social media and other ornamentation
Heading 1
“He that lies down with Dogs, shall rise up with fleas.”
- Poor Richard’s Almanack, 1733
Heading 2
“No gains without pains.”
- Poor Richard’s Almanack, 1745
Heading 3
Heading 4
“Pardoning the Bad, is injuring the Good.”
- Poor Richard’s Almanack, 1748
Heading 5
Heading 6
“Look before, or you’ll find yourself behind.”
- Poor Richard’s Almanack, 1735
1.174 type scale, based on 16px Atkinson Hyperlegible text and Helvetica headings:
42 41.181 H1 HelvBold Bld Ital Bld Ital und
36 35.683 H2 HelvBold Bld Ital Bld Ital und
30 30.394 H3 HelvBold Bld Ital Bld Ital und
26 25.890 H4 Bolded Helvetica un-bolded italic und
22 22.052 H5 Bolded Helvetica un-bolded italic und
19 18.784 H6 Bolded Helvetica un-bolded italic und
add Helv series used in compact calendar
1.174 type scale, based on 16px Atkinson Hyperlegible text:
42 41.181 Regular Bold Italic Bold Italic
36 35.683 Regular Bold Italic Bold Italic
30 30.394 Regular Bold Italic Bold Italic
26 25.890 Regular Bold Italic Bold Italic
22 22.052 Regular Bold Italic Bold Italic
19 18.784 Para1 Regular Bold Italic Bold Italic
16 16.000 Para2 Regular Bold Italic Bold Italic
14 13.629 Para3 Regular Bold Italic Bold Italic
​
scaling
​
Production fonts are based are based on a 1.174 scale (FYI: The cube root of the golden ratio).
Calculations were done using a base font size of 16px.
​
pixels calculated ems usage
208 208.358px 13.022em
177 177.477px 11.092em
151 151.173px 09.448em
129 128.767px 08.048em
110 109.682px 06.855em
093 093.426px 05.839em
080 079.579px 04.974em
068 067.785px 04.237em home "Welcome"
058 057.738px 03.609em
049 049.181px 03.074em
042 041.892px 02.618em h1
036 035.683px 02.230em h2
030 030.394px 01.900em h3
026 025.890px 01.618em h4
022 022.052px 01.378em h5
019 018.784px 01.174em h6 p1
016 016.000px 01.000em p2
014 013.629px 00.852em p3
012 011.609px 00.726em
010 009.888px 00.618em
008 008.423px 00.526em
1.174 type scale, based on 16px Avenir Light text:
Avenir was system default
42 41.181 H1 Light LightBold Avenir Bold
36 35.683 H2 Light LightBold Avenir Bold
30 30.394 H3 Light LightBold Avenir Bold
26 25.890 H4 Light LightBold Avenir Bold
22 22.052 H5 Light LightBold Avenir Bold
19 18.784 P1 H6 Light LightBold Avenir Bold
16 16.000 P2 Light LightBold Avenir Bold
14 13.629 P3 Light LightBold Avenir Bold
​
19 18.784 Para1 Avenir Light
16 16.000 Para2 Bolded Avenir Light
14 13.629 Para3 Avenir
