Typography

Type tokens set size, line height, and weight together. Use the token on its own and pick color with text-text-* classes.

Title

Page and section headings. Titles use -0.25px letter spacing.

text-title-regular
Learn and control how AI is talking about your brand.

28px / 32px, semibold. Page titles.

text-title-small-regular
Learn and control how AI is talking about your brand.

24px / 32px, regular.

text-title-small-medium
Learn and control how AI is talking about your brand.

24px / 32px, medium.

text-title-small-semibold
Learn and control how AI is talking about your brand.

24px / 32px, semibold. Section headings.

text-title-mini-regular
Learn and control how AI is talking about your brand.

18px / 24px, regular.

text-title-mini-medium
Learn and control how AI is talking about your brand.

18px / 24px, medium.

text-title-mini-semibold
Learn and control how AI is talking about your brand.

18px / 24px, semibold. Card and dialog titles.

Body

Interface text: labels, controls, table cells, and short copy. Body tokens inherit color.

text-body-regular
Learn and control how AI is talking about your brand.

14px / 20px, regular.

text-body-regular-medium
Learn and control how AI is talking about your brand.

14px / 20px, medium.

text-body-regular-semibold
Learn and control how AI is talking about your brand.

14px / 20px, semibold.

text-body-regular-spaced
Learn and control how AI is talking about your brand.

14px / 24px, regular. Taller line height for multi-line text.

text-body-small-regular
Learn and control how AI is talking about your brand.

13px / 18px, regular. The default size for product UI.

text-body-small-medium
Learn and control how AI is talking about your brand.

13px / 18px, medium.

text-body-small-semibold
Learn and control how AI is talking about your brand.

13px / 18px, semibold.

text-body-small-spaced
Learn and control how AI is talking about your brand.

13px / 20px, regular. Taller line height for multi-line text.

text-body-mini-regular
Learn and control how AI is talking about your brand.

12px / 16px, regular. Captions and metadata.

text-body-mini-medium
Learn and control how AI is talking about your brand.

12px / 16px, medium.

text-body-micro-regular
Learn and control how AI is talking about your brand.

10px / 14px, regular.

text-body-micro-medium
Learn and control how AI is talking about your brand.

10px / 14px, medium. Badges and tiny labels.

Paragraph

Long-form reading text, such as answers and descriptions.

text-paragraph-regular
Profound tracks how answer engines describe your brand. Each answer is parsed for mentions, citations, and sentiment, so you can see where you show up and why. Longer passages stay readable at this size.

14px / 20px, regular.

text-paragraph-small
Profound tracks how answer engines describe your brand. Each answer is parsed for mentions, citations, and sentiment, so you can see where you show up and why. Longer passages stay readable at this size.

13px / 18px, regular.

text-paragraph-small-relaxed
Profound tracks how answer engines describe your brand. Each answer is parsed for mentions, citations, and sentiment, so you can see where you show up and why. Longer passages stay readable at this size.

13px with a 1.7 line height, regular. Dense prose that needs more air.