HTML Showcase — Synthetic Legacies

A specimen post for checking the Synthetic Legacies theme. All examples inherit the site’s styles. No custom CSS has been added.

Typography

What remains of an event when its participants leave? A voice becomes a transcript. A gesture becomes an instruction. Each transfer asks someone to decide what should survive, how it should be described, and who will care for it.

Inspect bold, italic, bold italic, strikethrough, highlight, small text, superscript x2, subscript H2O, and inline code.

Accents and punctuation: é è ê ë à ç œ ñ ü. “Curly quotes,” ‘single quotes,’ apostrophes, ellipses… Figures: 0123456789; 10:30; 12.5%; €25; $30; £20; © 2026.

Internal link · External link · Anchor link. Check hover and keyboard focus.

https://vvv.balula.org/?css-test=long-link-for-checking-wrapping-and-overflow-on-mobile

Heading scale

Heading 1: Synthetic Legacies

A short paragraph following heading level 1. Check the space above and below.

Heading 2: Synthetic Legacies

A short paragraph following heading level 2. Check the space above and below.

Heading 3: Synthetic Legacies

A short paragraph following heading level 3. Check the space above and below.

Heading 4: Synthetic Legacies

A short paragraph following heading level 4. Check the space above and below.

Heading 5: Synthetic Legacies

A short paragraph following heading level 5. Check the space above and below.

Heading 6: Synthetic Legacies

A short paragraph following heading level 6. Check the space above and below.

Lists

  • Keep a record of the event.
  • Describe what the record leaves out.
    • Voices and gestures.
    • Conditions of participation.
  • Return to the source.
  1. Gather material.
  2. Compare accounts.
    1. Note agreements.
    2. Keep disagreements visible.
  3. Review with participants.
Custodian
A person entrusted with the care of a record or work.
Version
A dated state of a changing document.

Quotations

A record lasts because someone returns to it.

Sample text for CSS testing, not an attributed quotation.

Who will return to this record?

Sample pull quote

Separators

Image and caption

WordPress emblem used as a temporary CSS test image
Temporary image specimen. Replace with an SL photograph when checking large images, cropping, or galleries.

Tables

ElementWhat to inspectExample
TypographyWeight, leading, line lengthBody text
SpacingPadding and vertical rhythm24 / 48 / 96
WrappingA longer cell should remain readable on a small screen without hiding adjacent columns.Long content
FooterLast rowEnd
Table caption. Check horizontal overflow on mobile.
Striped row oneValue 01
Striped row twoValue 02
Striped row threeValue 03

Buttons

Default button
Outline button

Columns

Record

A short column checks the relation between heading and body text.

Return

A longer column checks uneven content. At narrow widths, both columns should remain readable. Inspect where they stack and whether their margins align with the rest of the post.

Code and preformatted text

{
  "project": "Synthetic Legacies",
  "review": ["desktop", "mobile"]
}
record      version     date
notes       01          2026-10-24
transcript  02          2026-10-24

Expandable details

Open to inspect the expanded content

Check the disclosure marker, keyboard focus, and spacing between the summary and this paragraph.

Alignment

Centered paragraph.

Right-aligned paragraph.

Notes and end matter

A sample sentence with a linked note.1

  1. Sample note for spacing and link styling. Return to reference.

More inline HTML

AI is an abbreviation. A living record is a record that can be revised. A book title uses Example Book Title; a short quotation uses return to the source.

A discarded interpretation. A revised interpretation. The variable n represents the number of entries. Press Ctrl + F (or ⌘ + F) to find text. Sample output: No matches found.

A machine-readable date: . A controlled line break follows:
Second line. A long compound can break here: hyperconnectedknowledgearchive.

Image pair and captions

WordPress emblem, first gallery specimen
Figure A. A small image with a short caption.
WordPress emblem, second gallery specimen
Figure B. The same source with a longer caption to check alignment and wrapping beside another figure.

Audio and video

Audio specimen: a short synthetic dinosaur roar. Text description: a low, growling roar. Playback starts only when you press Play.
Video specimen: a short silent close-up of flowers moving in the breeze. No speech or other audio is present.

Sample media sources: MDN Web Docs. These are external demonstration files.

Form controls — visual specimens only

These controls are disabled. This is a layout sample; it does not collect or submit information and is not a comment form.

Research note specimen












65%


65 out of 100

HTML source specimen

<article>
  <h2>A research insight</h2>
  <p>One idea, connected to its source.</p>
</article>

The theme supplies the post title, compact date, author, categories, tags, subject connections, and previous/next navigation. Comments and pingbacks are disabled. This post is a reusable specimen for checking HTML and theme styles as the archive develops.