Heading
Heading
is a component that represents section headings. By default, it renders an h1
element.
ギャルのパンティーおくれーーーっ!!!!!
<Heading>ギャルのパンティーおくれーーーっ!!!!!</Heading>
Usage
import { Heading } from "@yamada-ui/react"
import { Heading } from "@/components/ui"
import { Heading } from "@workspaces/ui"
<Heading />
Change Size
ギャルのパンティーおくれーーーっ!!!!!
ギャルのパンティーおくれーーーっ!!!!!
ギャルのパンティーおくれーーーっ!!!!!
ギャルのパンティーおくれーーーっ!!!!!
ギャルのパンティーおくれーーーっ!!!!!
ギャルのパンティーおくれーーーっ!!!!!
ギャルのパンティーおくれーーーっ!!!!!
ギャルのパンティーおくれーーーっ!!!!!
<VStack>
<For
each={[
{ as: "h1", size: "4xl" },
{ as: "h2", size: "3xl" },
{ as: "h2", size: "2xl" },
{ as: "h3", size: "xl" },
{ as: "h3", size: "lg" },
{ as: "h4", size: "md" },
{ as: "h5", size: "sm" },
{ as: "h6", size: "xs" },
]}
>
{({ as, size }, index) => (
<Heading key={index} as={as} size={size} truncated>
ギャルのパンティーおくれーーーっ!!!!!
</Heading>
)}
</For>
</VStack>
Add Gradient
クリリンのことか……クリリンのことかーーーっ!!!!!
<Heading
size="2xl"
bgClip="text"
bgGradient="linear(to-l, #7928CA, #FF0080)"
truncated
w="full"
>
クリリンのことか……クリリンのことかーーーっ!!!!!
</Heading>