# Text Die Text-Component sorgt für eine konsistente Formatierung und Strukturierung von Text. ```tsx import { Text } from "@mittwald/flow-react-components"; Das ist ein Text ``` --- # Best Practices - Formuliere Texte prägnant, verständlich und hilfreich. Orientiere dich am [Sprach-Guide](https://flow.mittwald.de/02-foundations/03-content-guidelines/01-sprach-guide). - Halte die Benutzeroberfläche auch ohne Text verständlich. Text wird häufig nur unaufmerksam wahrgenommen. - Begrenze die Zeilenlänge auf höchstens 75 Zeichen. Längere Zeilen erschweren die Lesbarkeit. - Kennzeichne Absätze über `elementType` korrekt als `

`. --- # Color Zusätzlich zur Standard-Color kann Text in **Light** und **Dark** dargestellt werden, wenn die Standard-Color auf farbigen oder dekorativen Hintergründen nicht gut funktioniert. Wann welche Color passt, beschreibt [Color](https://flow.mittwald.de/02-foundations/01-design/02-colors#light-und-dark-color). ```tsx import { Text } from "@mittwald/flow-react-components"; Das ist ein Text ``` ```tsx import { Text } from "@mittwald/flow-react-components"; Das ist ein Text ``` --- # Size Neben der Default-Schriftgröße unterstützt Text auch die Size **Small**. Nutze das ``-Tag, um sie zu verwenden. ```tsx import { Text } from "@mittwald/flow-react-components"; Das ist ein Text in small ``` --- # Mit elementType Verwende die `elementType`-Property, um festzulegen, welches HTML-Element die Text-Component rendern soll. Standardmäßig wird ein `` erzeugt. Für Fließtexte, die als eigenständige Absätze erkennbar sein sollen, verwende stattdessen ein `

`-Element. ```tsx import { Text } from "@mittwald/flow-react-components"; Das ist ein Absatz ``` --- # HTML-Elemente und Formatierungen Die Text-Component unterstützt alle gängigen Formatierungen und Elemente wie ``, ``, `