Small caps

Capital letters redrawn at lowercase height, so acronyms and labels read as emphasis without shouting.

little capitalscaps that don't shoutsmall capitalssmallcapsmini capstiny uppercase letterslowercase-sized capital lettersquiet acronyms in body text

See it

Live demo coming soon

What it is

Small caps are capital letters redrawn at roughly x-height, with the stroke weight thickened and the spacing opened up so they sit in a line of lowercase without looking shrunken. The point is emphasis at conversational volume: acronyms (NASA, PDF, HTTP), running heads, legal lines, the first few words after a drop cap.

Reach for them when full caps feel like yelling and italic feels too soft. In CSS the honest way is 'font-variant-caps: small-caps', which asks the font for its real 'smcp' glyphs. 'all-small-caps' converts the already-uppercase letters too, which is what you usually want for an acronym that is typed in caps.

Gotcha: most fonts do not ship small caps, and browsers will happily fake them by scaling the capitals down. Faux small caps come out spindly and cramped next to the real lowercase, and the giveaway is that the strokes look thinner than the surrounding text. If the font has no 'smcp' table, pick a different font or add a little tracking to make the fake less obvious.

Ask AI for it

Set the acronyms and section labels in real small caps: enable the OpenType 'smcp' feature via 'font-variant-caps: all-small-caps' (not 'text-transform: uppercase' at a smaller size, which fakes it and looks spindly). Use a typeface that actually ships small-cap glyphs, add about 0.05em of letter-spacing, and keep them the same color and weight as the body text so they read as texture, not as a shout.

You might have meant

cap heightx heightopentype featuresglyphtracking