Lorem ipsum dolor sit amet — typography demo

This page shows typical article content: body copy, inline formatting, headings, lists, tables, quotes, and media blocks.

Editor font sizes

WordPress presets on a whole paragraph:

Small — supporting detail or captions in running text.

Default paragraph (no preset class) — same as medium body copy.

Medium — explicit body preset.

Large — emphasis paragraph (35px, light weight).

Extra large — intro / lead paragraph (40px, regular weight; louder than h2).

Mixed sizes in one paragraph: opening sentence, then a small aside, back to body, then a large emphasis phrase, and a short lead-in span before the period.

H3 with Large preset on the heading block

H2 with Small preset (unusual but should not break layout)

List block set to Large — items inherit
Second item with small span inside

Quote block with Medium preset — should match body, not the default green quote size.

Author name

Inline formatting

Bold (strong),
italic (em),
underlined text,
internal link,
external link,
highlighted mark,
~~deleted text~~,
inserted text,
sub_script,
and super^script in one paragraph.

Also b element, i element, and underlined jump link to the table.

Headings

Heading levels as they might appear inside article content (page title is separate).

Heading level 1

Heading level 2

Heading level 3

Heading level 4

Heading level 5

Heading level 6

Lists

Unordered list:

First item with bold and a link
Second item with italic
Third item with nested list
- Nested unordered one
- Nested unordered two

Ordered list:

Step one
Step two with underline
Step three
1. Nested step A
2. Nested step B

Definition list

Term one: Definition for the first term, using the same body typography as paragraphs.
Term two: Second definition with a link inside.

Tables

HTML table (classic editor style):

Product	Region	Status
Platform	EMEA	Active
Analytics	APAC	Pilot
Reporting	Americas	Planned

Bare table without figure wrapper:

Quarterly summary
Q1	Q2	Q3
12%	18%	24%
9%	14%	21%

Blockquote

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit.

Lorem Ipsum, Dolor Sit

Code and preformatted

Inline code_snippet() inside a sentence.

// Preformatted block
function nuuka_demo() {
	return 'typography';
}

Separator and horizontal rule

Paragraph after a horizontal rule.

Image block

Lorem ipsum dolor sit amet, consectetur adipiscing elit sed do eiusmod

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Curabitur pretium tincidunt lacus. Nulla facilisi. Ut convallis, sem sit amet interdum consectetuer, odio augue aliquam leo, nec dapibus tortor nibh sed augue. Integer eu magna sit amet metus fermentum posuere.

Sed ut perspiciatis unde omnis iste natus error

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin pede metus, vulputate nec, fermentum fringilla, vehicula ut, odio. Mauris vestibulum, neque sed dictum eleifend, ligula nulla suscipit nunc, eget consectetuer pede velit auctor eros.

In hac habitasse platea dictumst. Fusce ac felis sit amet ligula pharetra condimentum. Maecenas egestas arcu quis ligula mattis placerat. Suspendisse pulvinar, augue ac venenatis condimentum, sem libero volutpat nibh, nec pellentesque velit pede quis nunc. Read more on our homepage or contact us for further details.

Ut enim ad minima veniam quis nostrum exercitationem
Quis autem vel eum iure reprehenderit in voluptate
Nemo enim ipsam voluptatem quia voluptas sit aspernatur

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.

Lorem Ipsum, Amet Consectetur

Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur.

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.

Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.

Typography demo