Overview

Asides (also called callouts or admonitions) are styled blockquotes that draw attention to important information. The styling is provided by design-tokens/asides.css.

Standard Blockquote

This is a standard blockquote. It has a left border and slightly different background to distinguish it from regular text.

Multi-paragraph blockquotes are also supported.

This is the second paragraph in the same blockquote.

Nested Blockquotes

Outer blockquote

Inner nested blockquote

Triple-nested blockquote

Blockquotes with Other Elements

Heading in a blockquote

Paragraph text in a blockquote.

• List item one
• List item two

// Code block in a blockquote
const x = 42;

Rich Blockquote Content

Important: This blockquote contains various inline elements.

It includes italic text, inline code, and a link to somewhere.

Even	Tables
work	inside blockquotes

Long Blockquote

This is a longer blockquote that contains multiple paragraphs of content to demonstrate how the styling handles larger blocks of quoted text. The left border should extend the full height of the content.

The background color provides subtle contrast against the main page background, making it easy to distinguish quoted content from the surrounding text.

This kind of extended blockquote might be used for longer quotations, extended notes, or important callout sections that need to stand apart from the regular content flow.