Font family

The coordinated set of regular, bold, italic, condensed, and other fonts that all share one underlying design.

all the weights of the same fontregular bold and italic setfonts that belong togetherthe whole Helvetica setthe Light Regular Bold list under one font namefont familiywhy did my font download come with nine filesone font in lots of weights

See it

Live demo coming soon

What it is

A font family is the coordinated set built from one underlying typeface design: regular, italic, bold, light, condensed, and whatever other styles the designer made to work together. Helvetica Neue is a family; Helvetica Neue Bold is one font within it. Adrian Frutiger laid Univers out as a numbered grid of 21 faces in 1957 and Helvetica Neue borrowed the scheme, which is why you still meet names like Helvetica Neue 55 Roman and 75 Bold. A larger superfamily can join related serif, sans, slab, or other branches.

Reach for the family when building hierarchy without changing the voice of the page. Weight can separate headings from body text, italic can mark emphasis, and width can solve tight spaces while the shared design keeps the system coherent.

The CSS font-family property is easy to confuse with the design term. Its value is an ordered fallback list, so `font-family: Inter, Arial, sans-serif` names one preferred family and then alternatives. A browser cannot use a weight or style that was never loaded without synthesizing an imitation.

Ask AI for it

Build a responsive type system from the Inter font family. Load only the roman and italic variable WOFF2 files with CSS @font-face, declare font-family: Inter, Arial, sans-serif, and map body, label, heading, and display roles to explicit font-weight values. Set font-synthesis: none so the browser does not invent bold or italic. Provide a specimen page showing every loaded weight and style, plus a Network panel checklist that names the two expected font requests.

You might have meant

typeface vs fontweight font weightvariable fontfont stackfont pairing

Go deeper