Pular para o conteúdo principal

Text

danger

This SDK is a Work In Progress! All features are subject to change.

The text component is used to render text with optional styling. It supports properties such as color, background, heading levels (h1-h6), text formatting modifiers (bold, italic, etc.), and inline display.

Text

Usage

Example
import { Box, Text } from "@tiendanube/nube-sdk-jsx";

function MyComponent() {
return (
<Box>
<Text color="red" background="blue">Hello!!</Text>
</Box>
);
}

Properties

PropertyTypeRequiredDescription
textstringYesThe text content to be displayed.
colorstringNoThe text color (can be CSS variable like "var(--primary-color)").
backgroundstringNoThe background color (can be CSS variable like "var(--primary-color)").
heading1|2|3|4|5|6NoThe heading level (h1-h6).
modifiersTxtModifier[]NoArray of text formatting modifiers.
inlinebooleanNoWhether the text should be displayed inline.
styleStyleSheetNoCustom styles for the text.