Blockquote
A styled pull quote or cited content block with optional attribution.
Basic usage
Design is not just what it looks like and feels like. Design is how it works.
vue
<Blockquote>
Design is not just what it looks like and feels like. Design is how it works.
</Blockquote>With citation
Pass cite to add an attribution line below the quote.
Design is not just what it looks like and feels like. Design is how it works.
vue
<Blockquote cite="Steve Jobs">
Design is not just what it looks like and feels like. Design is how it works.
</Blockquote>Sizes
Small
Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.
vue
<Blockquote size="sm" cite="Antoine de Saint-Exupéry">
Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.
</Blockquote>Medium (default)
The best way to predict the future is to invent it.
vue
<Blockquote size="md" cite="Alan Kay">
The best way to predict the future is to invent it.
</Blockquote>Large
Good design is as little design as possible.
vue
<Blockquote size="lg" cite="Dieter Rams">
Good design is as little design as possible.
</Blockquote>Props
| Prop | Type | Default | Description |
|---|---|---|---|
cite | string | undefined | Attribution or author text shown below the quote |
size | 'sm' | 'md' | 'lg' | 'md' | Font size of the quote text |
Slots
| Slot | Description |
|---|---|
default | The quote content |