Design Board

Keep the recurring blocks visible in one place.

This page is the lightweight reference for the AEON website system. It shows the main text and layout blocks we reuse across the homepage, walkthrough, and future pages.

It is not a full Storybook. It is a simple shared board for checking consistency while the site is still taking shape.

Text Styles

The core text primitives for the site voice and rhythm.

This board starts with the basic text primitives: kicker, highlighted title, headline, panel heading, panel copy, and prose.

These are the recurring pieces we want to keep stable as the AEON site grows.

Kicker

Highlighted title treatment.

Panel heading inside the standard right column.

Panel copy is the main descriptive text for feature sections. It should read comfortably in one or two short paragraphs without feeling like body copy on a card.

This is the same structure used on the homepage and the walkthrough.

Headline

A wider headline block for sections that are more editorial than feature-driven.

Prose text handles the longer explanatory passages. It is looser and more editorial than panel copy, but still sits within the same visual system.

This is useful for overview pages, explanatory sections, and framing text before examples.

Code Example

Playground-style code surface.

/(refresh these totals before publication?)/
summary@{intent="inform" audience="executive"} = "Conventions baseline"

totalConventions = 12
conventionList = [
  "aeon.gp.convention.v1"
  "aeon.gp.context.v1"
  "aeon.gp.limbo.v1"
]

publishedCount = ~totalConventions

Cards

Compact information blocks.

Homepage

Use for quick, scannable summaries where a full feature layout would feel too heavy.

Walkthrough

Useful later for lesson summaries, prerequisites, or “what you just learned” groupings.

Docs

Can also support reference lists, small callouts, or grouped entry points into the spec set.