This guide illustrates the correct specifications for blockquotes, including margins, padding, borders, and typography. Each example precisely demonstrates the measurements needed to maintain proper visual hierarchy and readability.

The following blockquote demonstrates our standard specifications:

This is a standard blockquote with 32px top and bottom margins, 24px left padding, and a 2px left border. The text maintains the same line height as body text (30px) to ensure consistent vertical rhythm throughout the document. Blockquotes should stand out from the surrounding content while remaining visually connected to it.

Key specifications:

• Margins: 32px top and bottom

• Padding: 24px left

This paragraph precedes a blockquote. When transitioning from paragraph text to a blockquote, we use a 32px margin. This provides enough separation to distinguish the quoted content as a distinct voice or reference, while maintaining connection to the surrounding text.

This blockquote appears 32px below the preceding paragraph. The generous margin helps create a visual break that signals to the reader that they're encountering quoted or referenced material that stands apart from the author's main text.

This blockquote precedes a paragraph. When quoted or referenced content is followed by the author's continued text, the 32px margin provides a clear transition back to the main narrative flow.

This paragraph appears 32px below the blockquote above. When returning to regular paragraph text after a blockquote, we maintain the same 32px spacing to create symmetry in the document's vertical rhythm. This consistent approach makes the content more predictable and easier to read.

This blockquote appears 24px below a heading. The heading-to-blockquote spacing follows the same pattern as heading-to-content spacing throughout the document. This creates consistency while acknowledging that the blockquote is content that belongs to the heading above it.

This blockquote precedes a heading. When a blockquote concludes one section before moving to a new topic, the spacing should create a clear visual break to signal the section transition.

The 40px spacing before a heading creates a clear section break, regardless of what content type precedes it. This consistent approach to section transitions improves content structure and readability.