Blockquote

A styled blockquote with left border, citation support, and accent variant.

Basic Usage

Default blockquote

The best way to predict the future is to invent it.

<x-wirekit::blockquote>
    The best way to predict the future is to invent it.
</x-wirekit::blockquote>

With Citation

Blockquote with author

The best way to predict the future is to invent it.
— Alan Kay

<x-wirekit::blockquote cite="Alan Kay">
    The best way to predict the future is to invent it.
</x-wirekit::blockquote>

Accent Variant

Accent blockquote

The best way to predict the future is to invent it.
— Alan Kay

<x-wirekit::blockquote variant="accent" cite="Alan Kay">
    The best way to predict the future is to invent it.
</x-wirekit::blockquote>

Props

Prop	Type	Default	Description
`cite`	string\|null	`null`	Citation / author name
`variant`	string	`'default'`	Border color: `default`, `accent`
`scope`	string\|null	`null`	Scoped personalization name

Keyboard Interaction

This component is purely presentational and does not respond to keyboard input.

Design Tokens

Token	Used for
`--color-wk-border`	Default border
`--color-wk-accent`	Accent border
`--color-wk-text`	Quote text
`--color-wk-text-muted`	Citation text

Usage & Conventions

Prop conventions — this component uses one or more of the shared semantic prop names (intent / variant / tone / surface). See Prop naming conventions for the canonical vocabulary, alias matrix, and decision tree.

Was this page helpful?

What was missing? (optional)

Voting requires cookies or local storage. What we store