Accurate conversion
Turn a familiar tracking value into both relative em and fixed px spacing.
Letter Spacing Calculator Online
Convert design tracking to CSS letter-spacing, compare the change live, or fit any line of text to an exact width.
BEFORE 0em
DESIGN WITH RHYTHM
AFTER 0.08em
DESIGN WITH RHYTHM
Airy & confident
Natural width0 px
With spacing0 px
Width change+0 px
From design tracking to production CSS
Get the value you need without reaching for a formula or guessing by eye.
Real text measurement
See how font, weight, size, and spacing change the rendered width of your exact text.
Fit to width
Enter a target width and let the calculator find the closest practical tracking value.
How to use the letter spacing calculator
- Enter the exact heading, label, or wordmark you want to test.
- Choose a similar font family, weight, and font size.
- Move the tracking control or select a spacing preset.
- Copy the calculated
em,px, or complete CSS declaration.
If a design specifies a tracking value such as 80, this online letter spacing calculator divides it by 1000 to produce 0.08em. At a 64px font size, the same value is 5.12px.
FORMULA
letter-spacing (em) = tracking / 1000letter-spacing (px) = font size × tracking / 1000Tracking vs CSS letter-spacing
Typography tools often call uniform character spacing tracking and express it in thousandths of an em. Browsers use the CSS letter-spacing property instead. A tracking value of -20 becomes -0.02em; 100 becomes 0.1em. Kerning is different: it adjusts specific letter pairs, while tracking changes the overall spacing across a run of text.
Should letter spacing use em or px?
Use em when the spacing should grow and shrink with the text. It is usually the resilient choice for responsive headings and reusable components. Use px when the spacing must remain physically fixed even if the font size changes. Always check the final typeface in the browser because font metrics affect the visual result.
TYPE TIP
Less is usually more for body text
Large uppercase headings can handle wider spacing. For paragraphs, keep letter spacing close to normal and prioritize readability. Negative values can make display type feel compact, but too much tightening causes letters to collide.
Letter spacing calculator FAQ
How do I convert tracking to CSS letter-spacing?
Divide tracking by 1000 for the em value. Multiply that result by the font size for pixels. Tracking 50 is 0.05em, which equals 0.8px at 16px.
What is the difference between tracking and letter-spacing?
They describe the same uniform spacing concept in different environments. Design software often uses tracking in thousandths of an em; CSS uses letter-spacing with units such as em or px.
Does letter spacing change text width?
Yes. Positive spacing widens a line and negative spacing narrows it. The exact rendered width also depends on the font, weight, size, and characters.
Should I use em or px for letter spacing?
Use em for spacing that scales with the font size. Use px for a fixed amount. The calculator shows both so you can choose the value that fits your layout.
Is this letter spacing calculator online and free?
Yes. It is free, requires no account, and calculates and measures your text locally in the browser.
Try other typography tools
Keep refining your text with these free online tools.