TextBasic text display element.
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> </> );}