1. Components
  2. Text

Text

Semantic text component with intent-based styling.

Demo

Default muted text

Body text for paragraphs

Title text for emphasis

Installation

terminal

Usage

The Text component provides semantic text styling with intent-based coloring. Use the intent prop to apply different text colors, and elementType to change the HTML tag.

Examples

Intents

Muted text for secondary information

Body text for main content

Title text for headings context

Caption text in gray

Primary colored text

Secondary colored text

Warning colored text

Destructive colored text

API

PropTypeDescription
intentmuted | body | title | caption | primary | secondary | warning | destructiveSemantic color intent for the text.
elementTypep | span | div | label | smallHTML tag to render (default: p).