Text Table of Contents

• Props
• Slots
• CSS Variables

Propertiestype BreakpointCustomizable<T> = { base: T; xs?: T; s?: T; m?: T; l?: T; xl?: T; xxl?: T; };PropertyAttributeDescriptionTypeDefaultalign alignText alignment of the component.type TextAlign =
'start'
'center'
'end'
'inherit'
'left' 🚫
'right' 🚫'start'color colorBasic text color variations depending on theme property.type TextColor =
'primary'
'contrast-low'
'contrast-medium'
'contrast-high'
'notification-success'
'notification-warning'
'notification-error'
'notification-info'
'inherit'
'brand' 🚫
'default' 🚫
'neutral-contrast-low' 🚫
'neutral-contrast-medium' 🚫
'neutral-contrast-high' 🚫
'notification-neutral' 🚫'primary'ellipsis ellipsisAdds an ellipsis to a single line of text if it overflows.booleanfalsesize 🛠sizeSize of the text. Also defines the size for specific breakpoints, like {base: "small", l: "medium"}. You always need to provide a base value when doing this.type TextSize =
'xx-small'
'x-small'
'small'
'medium'
'large'
'x-large'
'inherit'
BreakpointCustomizable<TextSize>'small'tag tagSets a custom HTML tag depending on the usage of the text component.type TextTag =
'p'
'span'
'div'
'address'
'blockquote'
'figcaption'
'cite'
'time'
'legend''p'theme themeAdapts the text color depending on the theme. Has no effect when "inherit" is set as color prop.type Theme =
'light'
'dark'
'auto''light'weight weightThe weight of the text.type TextWeight =
'regular'
'semi-bold'
'bold'
'thin' 🚫
'semibold' 🚫'regular'SlotsSlotDescriptionisRequiredaltPropallowedTagNames<slot> Default slot for the text to render.CSS VariablesCSS VariableDescriptiondefaultValue--p-hyphens Sets the CSS `hyphens` property for text elements, controlling whether words can break and hyphenate automatically.auto