Skip to content

Letter Spacing

Utilities for controlling the tracking (letter spacing) of an element.
ClassProperties
tracking-1 letter-spacing: 0.025em;
tracking-2 letter-spacing: 0.1em;
tracking-3 letter-spacing: 0.15em;
tracking-tighter letter-spacing: -0.05em;
tracking-neg-3 letter-spacing: -0.03em;
tracking-tight letter-spacing: -0.025em;
tracking-neg-2 letter-spacing: -0.02em;
tracking-neg-1 letter-spacing: -0.01em;
tracking-normal letter-spacing: 0em;
tracking-auto letter-spacing: auto;
tracking-wide letter-spacing: 0.025em;
tracking-wider letter-spacing: 0.05em;
tracking-widest letter-spacing: 0.1em;

Setting the letter spacing

Use the tracking-* utilities to control the letter spacing of an element.

html
<p class="tracking-tight ...">The quick brown fox ...</p>
<p class="tracking-normal ...">The quick brown fox ...</p>
<p class="tracking-wide ...">The quick brown fox ...</p>

Released under the MIT License.