All posts

Hello World

Sample

This is a sample post that demonstrates the typographic styles available on this blog. It exists purely for development and testing — think of it as a living style guide. Once real posts replace it, it can be deleted.

Second-Level Heading

Paragraphs are set in Libre Baskerville, a serif face designed for on-screen body reading. Line length is constrained by the --measure token so text never stretches uncomfortably wide. Here is a second sentence to show how paragraph spacing works across multiple lines of running prose.

This is a second paragraph. Notice the vertical rhythm between paragraphs — enough breathing room to separate ideas without fragmenting the reading flow.

Third-Level Heading

Third-level headings use Libre Franklin at a slightly smaller size than second-level headings. They work well for subsections within a larger topic.

Fourth-Level Heading

Fourth-level headings are available when you need a finer level of organization, though most posts will not need them.

Inline Formatting

Regular text can include bold text for strong emphasis and italic text for lighter emphasis. You can combine them for bold italic when warranted. Inline code renders in a monospace font with a subtle background highlight — useful for referencing function names, file paths, or terminal commands like npm run build.

Links

Links within body text appear underlined with a color shift on hover. External links should generally open in the same tab and let the reader navigate back, though the main site's publication links use target="_blank" for editorial references. Here is a link to the main site and one to a specific section.

Blockquotes

Blockquotes carry a gold left border and render in italic:

The question is not whether to teach AI. It is whether we can design curricula flexible enough to remain useful across tool generations.

A blockquote with multiple paragraphs:

First paragraph of the quotation. This establishes the speaker's premise and sets up the argument that follows.

Second paragraph of the quotation. Here the argument develops and reaches its conclusion.

Unordered Lists

Unordered lists use default disc markers with comfortable spacing:

  • First item in the list, long enough to demonstrate how wrapping behaves when the text exceeds a single line and flows onto subsequent lines within the same bullet point.
  • Second item.
  • Third item, with inline code to show how that renders inside a list.

Ordered Lists

Ordered lists use decimal numbering:

  1. First step: identify the problem.
  2. Second step: research existing approaches.
  3. Third step: design a solution and test it against edge cases.

Code Blocks

Fenced code blocks render on a dark background with horizontal scrolling for long lines:

// Example: a simple Eleventy filter
eleventyConfig.addFilter("readableDate", (dateObj) => {
  return new Date(dateObj).toLocaleDateString("en-US", {
    year: "numeric",
    month: "long",
    day: "numeric",
  });
});

A shorter example in a different language:

<link rel="stylesheet" href="https://assets.davidkemp.ai/tokens.css">

Images

Images receive rounded corners and vertical margin. Here is a placeholder to show the styling (replace with an actual image path when available):

Placeholder image description

Combining Elements

A realistic passage might combine several of these elements. For example:

ABA Model Rule 1.1, Comment 8, requires lawyers to keep abreast of "the benefits and risks associated with relevant technology." Meeting that obligation requires at least three things:

  1. Functional literacy — understanding what the tool does and does not do.
  2. Verification discipline — a systematic approach to checking AI-generated work product.
  3. Ethical judgment — recognizing when using an AI tool creates risks related to confidentiality or candor.

If a machine can easily do everything we are asking our students to do, then we are not asking enough of our students.

For more on this topic, see the Sample AI Policy for Legal Clinics or return to the blog index.

This post is a style sample. Delete it once the blog has real content.