Text
Text es el componente de texto, utilizado para escribir y formatear bloques de contenido dentro de páginas y componentes.
import React from "react";
import { Text } from "@nimbus-ds/components";
const Example: React.FC = () => <Text as="p">Lorem ipsum dolor sit amet</Text>;
export default Example;El componente Text posee un elemento HTML (p) o (span) estilizado utilizando nuestros tokens de tipografía para el body, pudiendo ser base, caption o small.
El contenido del componente puede ser alineado a la izquierda, centro o derecha. El criterio de uso de cada uno puede variar caso a caso, siendo más común el alineamiento a la izquierda para texto de corrido, al centro para informaciones únicas o puntuales y a la derecha para textos dentro de listas.
El componente permite formatear bloques de contenido, siendo posible personalizar el peso y el color usando las propiedades disponibles.
Usamos Text para escribir texto de corrido con jerarquía básica, además de formatear bloques específicos de contenido.
Componente Title - Usado para titular pantallas, páginas, bloques de texto, secciones u otros componentes, utilizando jerarquía visual y semántica.
El texto en negrita se debe utilizar para resaltar la información puntualmente.
La negrita debe usarse con moderación, evitando bloques largos de texto.
Para textos largos debemos dar preferencia a los estilos de longitud base.
los tamaños de texto resaltados deben evitarse para textos largos.
Cuando tenemos diferentes contenidos en una misma línea, debemos mantener el mismo estilo de texto.
No deberíamos tener tamaños contrastantes en la misma línea.
Para los textos es importante utilizar colores que no se mezclen con otro type de elementos.
El color del contenido no debe ser similar a los colores interactivos.
Instalá el componente via terminal.
npm install @nimbus-ds/textAdditional props are passed to the <Text> element. See p docs for a list of props accepted by the <Text> element.