TextGrundlegende Textanzeige.
Text
Lorem ipsum dolor sit amet
import Text from '@/components/Text'; export function Example() { return <Text>Lorem ipsum dolor sit amet</Text>;}
Text ($color)
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
import Text from '@/components/Text'; export function Example() { return ( <> <Text $color="default">Lorem ipsum dolor sit amet</Text> <Text $color="muted">Lorem ipsum dolor sit amet</Text> <Text $color="--color-red-400">Lorem ipsum dolor sit amet</Text> <Text $color="--color-blue-200">Lorem ipsum dolor sit amet</Text> <Text $color="--color-yellow-700">Lorem ipsum dolor sit amet</Text> </> );}
Text ($fontSize)
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
import Text from '@/components/Text'; export function Example() { return ( <> <Text $fontSize="xs">Lorem ipsum dolor sit amet</Text> <Text $fontSize="s">Lorem ipsum dolor sit amet</Text> <Text $fontSize="sm">Lorem ipsum dolor sit amet</Text> <Text $fontSize="m">Lorem ipsum dolor sit amet</Text> </> );}
Text ($fontWeight)
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
import Text from '@/components/Text'; export function Example() { return ( <> <Text $fontWeight="regular">Lorem ipsum dolor sit amet</Text> <Text $fontWeight="medium">Lorem ipsum dolor sit amet</Text> <Text $fontWeight="semibold">Lorem ipsum dolor sit amet</Text> <Text $fontWeight="bold">Lorem ipsum dolor sit amet</Text> </> );}
Text ($align)
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet
import Text from '@/components/Text'; export function Example() { return ( <> <Text $align="left">Lorem ipsum dolor sit amet</Text> <Text $align="center">Lorem ipsum dolor sit amet</Text> <Text $align="right">Lorem ipsum dolor sit amet</Text> </> );}