FoundationsReact Native

Text

Render native text with shared typography variants and semantic color tones.

Public APILumenTextReact Native

Native example

Use Text

Use the title and label roles for hierarchy, not as substitutes for application navigation semantics. Prefer the muted and soft tones for supporting copy.

View verified React Native runtime capture

Text rendered in the Expo web renderer Lumen playground — Verified runtime captureExpo web renderer

<LumenText variant="title" tone="default">
  Welcome back
</LumenText>

Reference

Public API

The primary shared and platform-specific options exposed by LumenText.

API	Values or type	Default	Description
children	`String / native text content`	`Required`	The text content.
variant	`body · caption · label · title`	`body`	Selects the shared typography role.
tone	`default · soft · muted · success · warning · danger`	`default`	Selects a semantic foreground role.
style	`Native layout or text styling`	`—`	Adds platform-native layout and presentation overrides.

Native behavior

Design and accessibility

When to use it

Use the title and label roles for hierarchy, not as substitutes for application navigation semantics. Prefer the muted and soft tones for supporting copy.

Accessibility

Text remains native text, supports platform font scaling, and preserves the semantic meaning supplied by its surrounding view.

Shared component

Available on other platforms

Apple / SwiftUI Android / Compose