Typography - acnorrisuk/coding-style-guide GitHub Wiki
Units
Line height should always be set with unitless values as pixels can cause issues (see Eric Meyer's post).
Setting font sizes in ems
and rems
is preferred over px
as the latter can zooming problems in some browsers.
Headings
When setting heading hierarchy, a modular scale should be used to ensure consistency and create harmony (see modularscale.com).
Try not to choose pure black as a colour, usually an off-black works best (e.g. #222).
The line height should be set somewhere between 1 - 1.2 for readability.
The contrast ratio should be at least 3:1 (minimum #949494 on a white background). See Contrastchecker.
Body
The line height should be set somewhere between 1.3 - 1.6.
Use a dark grey colour instead of pure black to aid readability (e.g. #444)
The contrast ratio should be at least 4.5:1 (minimum #767676 on a white background). See Contrastchecker.
The font size should be around 16px computed for mobile and 18-22px computed for desktop.
The optimal line length for copy is between 45-75 characters per line.