Quote

Native Solid 2 fork. Original documentation and designs © WorkOS; historical posts retain their original context.

His famous quote, Styles come and go. Good design is a language, not a style, elegantly summs up Massimo’s philosophy of design.

<Text>
	His famous quote,{" "}
	<Quote>Styles come and go. Good design is a language, not a style</Quote>,
	elegantly summs up Massimo’s philosophy of design.
</Text>

API Reference

This component is based on the q element and supports common margin props.

Prop	Type	Default
`asChild`	`boolean`	—
`truncate`	`boolean`	—
`wrap`	`Responsive<"wrap" \| "nowrap" \| "pretty" \| "balance">`	—

Examples

Truncate

Use the truncate prop to truncate text with an ellipsis when it overflows its container.

The goal of typography is to relate font size, line height, and line width in a proportional way that maximizes beauty and makes reading easier and more pleasant.

<Flex maxWidth="300px">
	<Quote truncate>
		The goal of typography is to relate font size, line height, and line width
		in a proportional way that maximizes beauty and makes reading easier and
		more pleasant.
	</Quote>
</Flex>