Capítulo 19 de 29
Font-related utilities (family, size, weight, style, stretch, smoothing, numeric variants, letter-spacing, line-height) each map to one CSS property with a theme-driven named scale, and text-<size> is special in that it sets font-size and a matched default line-height together (overridable with a /<n> suffix).
font-family (--font-* namespace): font-sans, font-serif, font-mono (each a theme-defined font stack), font-(family-name:<custom-property>), font-[<value>].
font-size (--text-* namespace, each step pairs a size with a matched line-height): text-xs (0.75rem) → text-9xl (8rem), 13 steps total; combine with a line-height override via text-<size>/<number> (spacing scale), text-<size>/(<custom-property>), or text-<size>/[<value>].
font-weight: font-thin(100), font-extralight(200), font-light(300), font-normal(400), font-medium(500), font-semibold(600), font-bold(700), font-extrabold(800), font-black(900), plus font-(<custom-property>)/font-[<value>].
font-style: italic, not-italic.
font-stretch (condensed/expanded font variants, only effective with variable fonts that support the axis): 9 named steps font-stretch-ultra-condensed(50%) → font-stretch-ultra-expanded(200%) plus font-stretch-normal(100%), or font-stretch-<percentage>.
-webkit-font-smoothing: antialiased (grayscale AA), subpixel-antialiased (OS default).
font-variant-numeric: normal-nums, ordinal, slashed-zero, lining-nums, oldstyle-nums, proportional-nums, tabular-nums (fixed-width digits — useful for aligning numbers in tables), diagonal-fractions, stacked-fractions.
font-feature-settings (raw OpenType feature toggles): font-features-[<value>] (e.g. font-features-['smcp'] for small caps), font-features-(<custom-property>).
letter-spacing (--tracking-*): tracking-tighter(-0.05em), tracking-tight(-0.025em), tracking-normal(0), tracking-wide(0.025em), tracking-wider(0.05em), tracking-widest(0.1em), plus arbitrary/custom-property forms.
line-height (--leading-*, independent of font-size): leading-none(1), leading-<number> (spacing scale), leading-(<custom-property>), leading-[<value>]. Named steps (tight/snug/normal/relaxed/loose) also exist as theme defaults referenced by the paired text-<size> line-heights.
hyphens: hyphens-none (never break, ignores the ­ soft-hyphen entity), hyphens-manual (breaks only at an explicit soft hyphen), hyphens-auto (browser picks break points automatically, needs lang set correctly).
line-clamp (multi-line truncation): line-clamp-<number> (sets -webkit-line-clamp + the supporting overflow/display: -webkit-box declarations needed to make it work), line-clamp-none (reverts all of them), line-clamp-(<custom-property>)/line-clamp-[<value>].
List style (list-style-*): list-disc/list-decimal/list-none/list-(<custom-property>)/list-[<value>] (marker type), list-inside/list-outside (marker position relative to content), list-image-[<value>]/list-image-none (custom marker image, e.g. an inline SVG data URI).
<h1 class="text-3xl/tight font-bold tracking-tight">Heading</h1>
<td class="tabular-nums">1,204.50</td>
<p class="line-clamp-3">Long description text that gets cut off after three lines...</p>
text-<size>/<leading> combined syntax, tabular-nums for column alignment, and line-clamp-* for multi-line truncation without JS.text-<size> sets both font-size and a default line-height in one class — override just the line-height with the /<value> suffix rather than adding a separate leading-* class when you only need to tweak that one pairing.tabular-nums is the fix for numbers misaligning in tables/dashboards when digit widths vary by default.line-clamp-* needs no JS and works via -webkit-line-clamp (broadly supported despite the vendor prefix) — prefer it over manual height + overflow-hidden truncation.hyphens-auto requires the element (or an ancestor) to have a correct lang attribute to hyphenate correctly.--font-*, --text-*, --font-weight-*, --tracking-*, --leading-* are all theme namespaces documented there.