Xmeter Style Guide

7.13 #Atoms.font-size font-size

Toggle example guides Toggle HTML markup

Set the font-size property on an element. There are eight Atoms available, each corresponding to a font-size given by the project’s type scale. You can see the source for the font-size settings in /src/__settings.less.

author
Chris Harvey
updated
Example
  • Quark (0.625)
  • Atom (0.75)
  • Molecule (1.00)
  • Asteroid (1.25)
  • Planet (1.75)
  • Star (2.25)
  • Galaxy (3.00)
  • Universe (4.00)
Markup 
<!--link rel="stylesheet" href="/node_modules/xmeter/css/dist/-fz.css"/-->
<ul>
  <li class="-fz-micr">Quark    (0.625)</li>
  <li class="-fz-mill">Atom     (0.75) </li>
  <li class="-fz-norm">Molecule (1.00) </li>
  <li class="-fz-kilo">Asteroid (1.25) </li>
  <li class="-fz-mega">Planet   (1.75) </li>
  <li class="-fz-giga">Star     (2.25) </li>
  <li class="-fz-tera">Galaxy   (3.00) </li>
  <li class="-fz-peta">Universe (4.00) </li>
</ul>
Source: _-fz.less, line 9