Body

Generous line height and wider letter spacing for long-form copy

Live demo

Cross-country skiing (sometimes called classic skiing) encompasses several styles, from touring or racing on groomed ski tracks to gliding through deep backcountry snow.

Body styles work best for long-form copy like articles, customer reviews, or legal messages. Body styles have a generous line height and wider letter spacing for optimal reading. For tighter, more compact styles, use utility styles.

Type	Purpose
Strong	Body strong is also intended for long-form copy but should be used minimally. Use body strong styles when emphasizing a subset of copy and never for the entire length of copy.

Applying strong to body styles

Body styles include a set of strong options: cdr-text-body-strong-500, cdr-text-body-strong-400, and cdr-text-body-strong-300. However, sometimes a set of words within a sentence needs to be bold. In those cases, use the generic cdr-text-strong. The set of strong options have a lighter font weight than the generic cdr-text-strong.

Usage

When to use

Displaying articles for long-form content, such as Expert Advice articles or Co-op Journal entries
Displaying member or legal messages, such as on the PDP
Displaying product descriptions
Displaying customer reviews, such as on the PDP

When not to use

Displaying form inputs. Instead, use inputs
Listing product features. Instead, use lists

Best practices

Max-width for paragraph containers is 634px or line length should not exceed 75 characters per line.

Don't

Use body styles for:

Legal messages
Shipping messages
Customer reviews
Product, class, event, or trip descriptions
Editorial copy
Long articles

Colors

Use standard (dark) text colors on light backgrounds for article text
When choosing body colors, consider cdr-color-text-primary, cdr-color-text-secondary, cdr-color-text-emphasis, or cdr-color-text-inverse
If needed, cdr-color-text-sale is also available
Avoid cdr-color-text-brand for body styles

Content

Use adjacent text, a definition list, a glossary, or other method to supplement words that are ambiguous
For ease of reading, readability level should be about Grade 7. To test the body text, use the Hemingway Editor
When possible, write the first sentence as an introduction to the paragraph. With screen readers, users can jump from paragraph to paragraph, listening to the first sentence or two before moving on to the next paragraph

For abbreviations:

Follow REI Copy Guidelines for dates, time, dimensions, measurements, electrical units and geographic reference
Expand abbreviations by explaining the definition the first time it is used
Use the <abbr> element, or link to a definition or glossary