Design system/FoundationsTypographyThe two families and the text styles built from them.FamiliesTwo families. Inter does nearly everything; Manrope is kept for the largest headings.InterWeights 300 to 700. Body, interface and most headings.Aa Bb Cc 0123456789ManropeWeights 500 to 800. Hero headings only.Aa Bb Cc 0123456789Text stylesEach style is one class. Sizes come from the type scale, so a page never sets a font size of its own. Click a class name to copy it.Copy .t-heroManrope 70048px, line height 1.17-0.02em letter spacing40px at 768px and underI design products, build tools, and tell stories.Copy .t-hero-subInter 40032px, line height 1.4-0.01em letter spacing22px at 768px and underI design products, build tools, and tell stories.Copy .t-h1Inter 60032px, line height 1-0.015em letter spacing28px at 768px and underI design products, build tools, and tell stories.Copy .t-h2Inter 60024px, line height 1.14-0.01em letter spacingI design products, build tools, and tell stories.Copy .t-h3Inter 60018px, line height 1.4I design products, build tools, and tell stories.Copy .t-body-lgInter 40018px, line height 1.4I make complex software easier to use and build tools for visual storytelling.Copy .t-bodyInter 40016px, line height 1.45I make complex software easier to use and build tools for visual storytelling.Copy .t-metaInter 50014px, line height 1.45I make complex software easier to use and build tools for visual storytelling.Previous: ColorNext: Layout