Primitive helper to style basic text. It displays as a span.
If your content is a paragraph, you should use the Paragraph component instead.
| Property | Type | Required | Default | Description |
|---|---|---|---|---|
| bold | Boolean | false | - | |
| color | Responsivevalue<string> | false | - | The color utility parses a component's `color` and `bg` props and converts them into CSS declarations. By default the raw value of the prop is returned. Color palettes can be configured with the ThemeProvider to use keys as prop values, with support for dot notation. Array values are converted into responsive values. [MDN reference](https://developer.mozilla.org/en-US/docs/Web/CSS/color) |
| bg | Responsivevalue<tlengthstyledsystem> | false | - | The color utility parses a component's `color` and `bg` props and converts them into CSS declarations. By default the raw value of the prop is returned. Color palettes can be configured with the ThemeProvider to use keys as prop values, with support for dot notation. Array values are converted into responsive values. [MDN Reference](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color) |
| fontFamily | Responsivevalue<string> | false | - | |
| fontWeight | Responsivevalue<fontweightproperty> | false | - | The font-weight CSS property specifies the weight (or boldness) of the font. The font weights available to you will depend on the font-family you are using. Some fonts are only available in normal and bold. [MDN reference](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) |
| fontSize | Responsivevalue<tlengthstyledsystem> | false | baseText | The fontSize utility parses a component's `fontSize` prop and converts it into a CSS font-size declaration. - Numbers from 0-8 (or `theme.fontSizes.length`) are converted to values on the [font size scale](#default-theme). - Numbers greater than `theme.fontSizes.length` are converted to raw pixel values. - String values are passed as raw CSS values. - And array values are converted into responsive values. |
| lineHeight | Responsivevalue<tlengthstyledsystem> | false | normal | The line-height CSS property sets the amount of space used for lines, such as in text. On block-level elements, it specifies the minimum height of line boxes within the element. On non-replaced inline elements, it specifies the height that is used to calculate line box height. [MDN reference](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) |