Blockquote
Blockquote renders the native <blockquote> element for quotations from another
source. Its leading accent, spacing, type, and color all resolve through Manti
tokens.
Components should preserve the meaning of the HTML they render.
A shared token language makes every new primitive feel at home.
Attribution
The native cite attribute stores a source URL but does not display it. Put
visible attribution next to the Blockquote in your own <cite> element when
readers need to see the source.
API
Blockquote accepts every native <blockquote> attribute in addition to the
props below.
| Prop | Type | Default | Description |
|---|---|---|---|
size | 'md' | 'lg' | 'md' | Visual size of the quoted text. |
cite | string | — | Native source URL for the quotation. This metadata is not rendered as visible attribution. |
Styling
Anatomy
| Part | Selector | Description |
|---|---|---|
root | [data-scope="blockquote"][data-part="root"] | The semantic <blockquote> element. |
Tokens
| Token | Controls |
|---|---|
--manti-blockquote-accent-width | accent width |
--manti-blockquote-padding-x | padding x |
--manti-blockquote-font-size | font size |