Illustrator to CSS Cheat Sheet

Here’s a quick typography cheat sheet when translating an Adobe app’s font styles to CSS.

Font Size (pt to rem)

Converting units to inches:

  • 1pt is 1/72in
  • 1px is 1/96in
  • pt to px = 96 / 72, or 1.3333

1rem is commonly 16px, thus the full equation is

rem=pt1.333÷16rem = pt * 1.333 ÷ 16

Tracking to letter-spacing (em)

Illustrator tracking 1/1000em

Leading to line-height (unitless)

Line-height (unitless) is calculated by dividing leading (pt) by font size (pt)

lineHeight=leading÷fontSizelineHeight = leading ÷ fontSize

Note: Illustrator default is 1.2

See something inaccurate?