How It Works

Set a font size and line length [plus any of the numerous settings].
TypeUp turns those into a set of CSS rules for vertical rhythm in pixel snapped ems.


  • Good defaults
  • Easy to use
  • Configurable
  • Perfect for responsive web design
  • Modular Scale for font sizing


TypeUp calculates a good baseline for your typography based on line length. Roll with the defaults or fine tune them with precision.


TypeUp sets type for common elements (h[1-6], p, ul, ol, pre, blockquote), but with the same mixins TypeUp uses internally you can set your type to any element, fast.


You’ll have tried 5 different typographic designs in the browser before you can set the proper adjustment in Photoshop for one.

Modular Scale

TypeUp depends on the Modular Scale gem for font sizing, which delivers beautiful heading hierarchies. Customize the scale ratio as you want - TypeUp makes sure each heading has proper spacing.


Copyright 2013 Tommi Kaikkonen. Released under MIT License.

Type Up is made by Tommi Kaikkonen (@tommikaikkonen).