Typography & Gutenberg Blocks Showcase

This page demonstrates how common Gutenberg blocks are styled in the theme: headings, paragraphs, links, lists, quotes, code, tables, separators, columns, media, buttons, and more.

This is a link example. Here is bold text, italic text, strikethrough, highlight, and inline code.

Headings

Heading level 3

Heading level 4

Heading level 5

Heading level 6

Lists

Unordered list:

• List item one
• List item two
  • Nested item A
  • Nested item B
• List item three

Ordered list:

1. First item
2. Second item
3. Third item

Quotes & Pullquote

This is a standard quote block. It should have proper typography and spacing.

Quote citation

Code

Inline code example: npm run build

<?php
// Code block example
add_action('init', function () {
  // Your code here
});

Preformatted text keeps spacing.
Line 2
    Indented line 3

Table

Media & Captions

Buttons

Columns

Typography Extras

Small text: this is small. Superscript: 10². Subscript: H₂O. Abbreviation: SEO.

Separator & Spacer

Text after spacer to check vertical rhythm.