Block-level quotation from another source.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Blockquote>Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
This component is based on the blockquote
element and supports common margin props.
Prop | Type | Default |
---|---|---|
asChild | boolean | No default value |
size | Responsive<enum> | No default value |
weight | Responsive<"light" | "regular" | "medium" | "bold"> | No default value |
color | enum | No default value |
highContrast | boolean | No default value |
truncate | boolean | No default value |
wrap | Responsive<"wrap" | "nowrap" | "pretty" | "balance"> | No default value |
Use the size
prop to control the size.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="5">
<Box maxWidth="300px">
<Blockquote size="1">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="350px">
<Blockquote size="2">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="400px">
<Blockquote size="3">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="450px">
<Blockquote size="4">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="500px">
<Blockquote size="5">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="550px">
<Blockquote size="6">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="600px">
<Blockquote size="7">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="650px">
<Blockquote size="8">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
<Box maxWidth="1000px">
<Blockquote size="9">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Box>
</Flex>
Use the weight
prop to set the text weight.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="3" maxWidth="500px">
<Blockquote weight="regular">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
<Blockquote weight="medium">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
<Blockquote weight="bold">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Flex>
Use the color
prop to assign a specific color.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="3" maxWidth="500px">
<Blockquote color="indigo">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
<Blockquote color="cyan">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
<Blockquote color="orange">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
<Blockquote color="crimson">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Flex>
Use the highContrast
prop to increase color contrast with the background.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex direction="column" gap="3" maxWidth="500px">
<Blockquote color="gray">Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
<Blockquote color="gray" highContrast>
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
</Blockquote>
</Flex>
Use the truncate
prop to truncate text with an ellipsis when it overflows its container.
Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
<Flex maxWidth="500px">
<Blockquote truncate>Perfect typography is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.</Blockquote>
</Flex>