文本

import { Text } from "@chakra-ui/react"

const Demo = () => {
  return <Text>Sphinx of black quartz, judge my vow.</Text>
}

import { Stack, Text } from "@chakra-ui/react"

const Demo = () => {
  return (
    <Stack>
      <Text textStyle="xs">Chakra</Text>
      <Text textStyle="sm">Chakra</Text>
      <Text textStyle="md">Chakra</Text>
      <Text textStyle="lg">Chakra</Text>
      <Text textStyle="xl">Chakra</Text>
      <Text textStyle="2xl">Chakra</Text>
      <Text textStyle="3xl">Chakra</Text>
      <Text textStyle="4xl">Chakra</Text>
      <Text textStyle="5xl">Chakra</Text>
      <Text textStyle="6xl">Chakra</Text>
      <Text textStyle="7xl">Chakra</Text>
    </Stack>
  )
}

import { Stack, Text } from "@chakra-ui/react"

const Demo = () => {
  return (
    <Stack>
      <Text fontWeight="light">Sphinx of black quartz, judge my vow.</Text>
      <Text fontWeight="normal">Sphinx of black quartz, judge my vow.</Text>
      <Text fontWeight="medium">Sphinx of black quartz, judge my vow.</Text>
      <Text fontWeight="semibold">Sphinx of black quartz, judge my vow.</Text>
      <Text fontWeight="bold">Sphinx of black quartz, judge my vow.</Text>
    </Stack>
  )
}

import { Flex, Text } from "@chakra-ui/react"

const Demo = () => {
  return (
    <Flex maxW="300px">
      <Text truncate>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
      </Text>
    </Flex>
  )
}

import { Flex, Text } from "@chakra-ui/react"

const Demo = () => {
  return (
    <Flex maxW="300px">
      <Text lineClamp="2">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
        veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
        commodo consequat.
      </Text>
    </Flex>
  )
}