@nimbus-ds/text

Text is the text component, used to write and format blocks of content within pages or components.

Implementation

Install the component via terminal.

$ yarn add @nimbus-ds/text
# or
$ npm install @nimbus-ds/text

Component Anatomy

The Text component is composed of a stylized (p) or (span) that consumes our typography tokens for the body, namely the base, the caption and the small.

Guidelines

Alignments

Component content can be left, center and right aligned. The criteria for using each one may vary on a case-by-case basis, the most common being the left for running text, the center for unique or punctual information and the right for texts within lists of information.

Formatting

The component allows you to format snippets of content, being able to customize the weight and color using the span property.

Usage recommendations

We use Text to write plain text with a basic hierarchy, in addition to formatting specific pieces of content.

Related components

Title Component - Used to title and subtitle screens, pages, text blocks, sections or other components, employing visual and semantic hierarchy.

Usage

View docs here.