Body Text

Title

Use the body text component to add the main content of a page or section. This area is designed for flexible, content-rich communication and supports a variety of media and formatting options.

The body text component is used across many other components and templates throughout the design system, making it a foundational element for delivering accessible, readable, and engaging content.

You can include:

Headings for longer sections make content easy to scan
Text paragraphs for general content
Text styles such as bold, italic, underline, and strikethrough
Rich media such as links, images, and custom code
Bullet and numbered lists to organize information clearly
Buttons in various styles (featured below)

Button Style 1 Button Style 2 Button Style 3

Guidelines

- For the main written content of a webpage, such as paragraphs, articles, reports, or explanatory sections.
- Whenever you need to present readable, continuous text that conveys information, instructions, or narratives.
- As the default text style for most page content when no other specific component (e.g., headline, caption, label) applies.
- To ensure accessibility and consistency across pages—this is the baseline text format every page should use.
- Don’t use body text for page titles, section headings, or emphasized callouts—use heading or display text styles instead.
- Don’t use body text for labels, buttons, navigation links, or other UI elements where a different component is defined.
- Avoid applying excessive styling overrides (e.g., arbitrary colors, font sizes, or weights) that break consistency.
- Don’t overuse all caps, italics, or underlines in body text, as this reduces readability and accessibility.
- Use clear headings to split up larger pieces of content.
- Always write in plain language.

You are using an unsupported browser. Please use Microsoft Edge.

Title

You can include:

Guidelines

When to Use

What to Avoid

Accessibility Tips