CSS3 introduces a few new units, including the rem unit, which stands for "root em". The rem unit is relative to the font-size of the root element html . That means that we can define a single font size on the root element, and define all rem units to be a percentage of that. The typography has font-size defined in 1.6rem (16px) and line-height in 1.6 (24px). Milligram uses the font-family Roboto, created by Christian Robertson, and provided by Google.

Heading h1 4.6rem (46px)

Heading h2 3.6rem (36px)

Heading h3 2.8rem (28px)

Heading h4 2.2rem (22px)

Heading h5 1.8rem (18px)
Heading h6 1.6rem (16px)
/* Base font-size and line-height */

The base type is 1.6rem (16px) over 1.6 line height (24px)

/* Other elements to text markup */ Anchor Emphasis Small Strong Underline /* Default Headings */





/* The base font-size is set at 62.5% for having the convenience of sizing rems in a way that is similar to using px. So basically 1.6rem = 16px. */


You can view more examples of using Milligram.


Want to contribute? Follow these recommendations.

Subscribe to our newsletter

The latest news and resources sent straight to your inbox.