Typography Test — Common Editorial Samples

This article is a typography specimen for reviewing headings, body copy, emphasis, lists, quotes, tables, images, and editorial components. The article title above serves as the H1 sample.

Blue heading — editorial style

A blue H2 heading selected with CKEditor Styles or inserted through Templates. Ordinary headings below retain the neutral typography defaults.

Bar heading — editorial style

A dark H2 heading with a short blue vertical line, matching the second detail-page design.

Dot heading — editorial style

A dark H3 heading with a small blue square. Its marker is decorative, so the heading remains fully editable and accessible.

Heading hierarchy — H2

A clear hierarchy helps readers scan an article. This paragraph follows a level-two heading and includes bold emphasis, italic emphasis, and bold italic emphasis.

Section heading — H3

Good typography balances font size, line height, line length, and spacing. Compare the distance between this paragraph and the next heading.

Subsection heading — H4

This is a short paragraph beneath a fourth-level heading.

Minor heading — H5

This is a short paragraph beneath a fifth-level heading.

Smallest heading — H6

This is a short paragraph beneath a sixth-level heading.

Paragraphs, punctuation & links

Typography makes long-form content easier to read. A comfortable measure allows the eye to move naturally across each line, while generous leading keeps adjacent lines distinct. This longer paragraph tests wrapping, rhythm, and the contrast between ordinary text and emphasized phrases across desktop and mobile screens.

“Smart quotes”, ‘single quotes’, an em dash — and an en dash – should remain readable. Numbers: 0123456789; prices: $1,299.00, €99.95, ¥680; symbols: © ® ™ & + − × ÷ %.

Visit UROVO for an external link, return to the home page for an internal link, or test a longer linked phrase that can wrap naturally onto a second line on smaller screens.

Explicit line break sample:
First line of an address
Second line of an address
City, country, postal code

中文排版示例：这是用于检查中文字体、标点与行高的测试段落。中英文混排 Typography 2026，包含数字 12345、全角标点，以及加粗文字和强调文字。请检查移动端换行是否自然。

Unordered & nested lists

• A short bullet item.
• A longer bullet item with enough text to wrap onto another line on a small screen, so indentation and line spacing can be inspected.
• A parent item with nested content:
  • Second-level bullet.
  • Another nested bullet with emphasis and a link.
    • Third-level bullet.
• Final top-level item.

Ordered & mixed lists

1. Prepare the device.
2. Configure the connection.
   1. Select a network.
   2. Confirm the settings.
3. Review the results:
   • Check connection quality.
   • Confirm synchronization.

A numbered list with a custom starting value:

4. Step four.
5. Step five.
6. Step six.

Block quotations

Good typography is a quiet foundation for clear communication. It gives every sentence room to breathe and every idea a visible place in the story.

— Typography sample, editorial quotation

This paragraph tests the transition back to normal body text after a quotation.

Tables

A table with merged cells:

Table styles and spacing

Choose a border style and a spacing style independently in CKEditor Styles. Defaults use row borders with loose spacing.

Full borders / Compact

Full borders / Loose

Row borders / Compact

Row borders / Loose

Semantic text colors

Primary text, secondary text, accent text, foreground text, muted text, and destructive text.

Image & caption

This paragraph follows the image and caption to test the vertical spacing between media and body copy.

Product teaser component

Long words & final paragraph

Long-word wrapping sample: internationalization, telecommunications, and SuperLongUnbrokenTypographySampleForResponsiveWrapping0123456789.

The final paragraph completes the typography specimen. Check the spacing before the article footer and compare the overall reading rhythm with the opening paragraphs.